{"id":18555678,"url":"https://github.com/mixpanel/framesg","last_synced_at":"2025-04-09T23:32:24.465Z","repository":{"id":57241391,"uuid":"54181135","full_name":"mixpanel/framesg","owner":"mixpanel","description":"request/response communication to/from iframes","archived":true,"fork":false,"pushed_at":"2017-07-06T01:59:13.000Z","size":9,"stargazers_count":5,"open_issues_count":1,"forks_count":2,"subscribers_count":66,"default_branch":"master","last_synced_at":"2025-03-26T23:03:25.643Z","etag":null,"topics":["handler","iframe","postmessage-api","promise"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mixpanel.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-03-18T07:05:06.000Z","updated_at":"2025-01-12T00:25:11.000Z","dependencies_parsed_at":"2022-09-08T00:40:54.985Z","dependency_job_id":null,"html_url":"https://github.com/mixpanel/framesg","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mixpanel%2Fframesg","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mixpanel%2Fframesg/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mixpanel%2Fframesg/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mixpanel%2Fframesg/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mixpanel","download_url":"https://codeload.github.com/mixpanel/framesg/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248129935,"owners_count":21052668,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["handler","iframe","postmessage-api","promise"],"created_at":"2024-11-06T21:27:33.846Z","updated_at":"2025-04-09T23:32:23.705Z","avatar_url":"https://github.com/mixpanel.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# framesg\n\nTalk to iframes sanely. Framesg manages request/response cycles on top of `window.postMessage` with ES2015 Promises.\n\n## Installation\n\nInstall via `npm`, for packaging with a bundler such as `Webpack` or `Browserify`:\n\n    npm install --save framesg\n\nIf your target environment does not supply `Promise` natively, provide it with any A+\\-compliant implementation such as [Bluebird](http://bluebirdjs.com/).\n\n## Usage\n\nRegister handlers with a target window, e.g., the parent of the current iframe:\n```javascript\nimport Framesg from 'framesg';\nconst parentFrame = new Framesg(window.parent, 'my-app', {\n\n  sayHello: username =\u003e alert(`Hello ${username}!`),\n\n  getUserInfo: userID =\u003e userInfo[userID], // response to caller\n\n});\n```\nThe first argument is the window/iframe to communicate with (typically `window.parent` within an iframe, and `iframeEl.contentWindow` within a parent where `iframeEl` is the iframe's DOM element). The second argument (`'my-app'` in the example above) is a user-supplied namespace. The third argument is an object mapping endpoint names to handler functions.\n\nSend a message to another frame:\n```javascript\nparentFrame.send('getWidgetInfo', widgetID)\n  .then(widgetInfo =\u003e console.log(widgetInfo))\n  .catch(err =\u003e console.error(`Error getting widget info: ${err}`));\n```\n`send` returns a promise, which is resolved with the response value from the other frame.\n\nIf a handler returns a promise rather than an immediate value, the response message is only sent to the other frame when the promise is resolved or rejected, which is useful for asynchronous actions:\n```javascript\nconst childFrame = new Framesg(iframeEl.contentWindow, 'my-app', {\n\n  fetchWombatInfo: wombatID =\u003e new Promise((resolve, reject) =\u003e\n    makeLegacyWombatApiCall(\n      function success(wombatInfo) { resolve(wombatInfo); },\n      function error(errorMsg) { reject(errorMsg); }\n    )\n  ),\n\n});\n```\n\nMore handlers can be added after initialization:\n```javascript\nparentFrame.addHandler('marco', () =\u003e 'polo');\n```\n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmixpanel%2Fframesg","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmixpanel%2Fframesg","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmixpanel%2Fframesg/lists"}