{"id":13817020,"url":"https://github.com/lume/asdom","last_synced_at":"2026-03-05T23:02:56.983Z","repository":{"id":42519623,"uuid":"380574729","full_name":"lume/asdom","owner":"lume","description":"Use DOM APIs in AssemblyScript","archived":false,"fork":false,"pushed_at":"2024-06-16T05:03:50.000Z","size":23704,"stargazers_count":103,"open_issues_count":2,"forks_count":9,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-10-27T18:34:44.231Z","etag":null,"topics":["assemblyscript","dom","dom-manipulation","html","javascript","typescript","webassembly"],"latest_commit_sha":null,"homepage":"https://lume.io","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/lume.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":"supported-APIs.md","governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2021-06-26T18:46:15.000Z","updated_at":"2025-10-10T20:59:24.000Z","dependencies_parsed_at":"2025-05-17T21:36:00.226Z","dependency_job_id":"f19e92c3-f9d8-468c-bf74-3085e0238e83","html_url":"https://github.com/lume/asdom","commit_stats":{"total_commits":161,"total_committers":10,"mean_commits":16.1,"dds":"0.36645962732919257","last_synced_commit":"370337b11c687be19ac025eb3a9d8bc5c6ae8156"},"previous_names":[],"tags_count":19,"template":false,"template_full_name":null,"purl":"pkg:github/lume/asdom","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lume%2Fasdom","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lume%2Fasdom/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lume%2Fasdom/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lume%2Fasdom/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/lume","download_url":"https://codeload.github.com/lume/asdom/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lume%2Fasdom/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30154285,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-05T22:39:40.138Z","status":"ssl_error","status_checked_at":"2026-03-05T22:39:24.771Z","response_time":93,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["assemblyscript","dom","dom-manipulation","html","javascript","typescript","webassembly"],"created_at":"2024-08-04T06:00:31.324Z","updated_at":"2026-03-05T23:02:56.967Z","avatar_url":"https://github.com/lume.png","language":"TypeScript","funding_links":[],"categories":["Packages","Projects"],"sub_categories":["Web frameworks-libraries"],"readme":"# asdom\n\nUse DOM APIs in [AssemblyScript](https://assemblyscript.org) (TypeScript compiled to WebAssembly).\n\nThis allows us to write WebAssembly applications that can\nmanipulate the DOM, and with potential for more speed!\n\n# Early Stages!\n\nWork in progress (probably may always be), but right now it's early and many APIs need to be added.\n\n# Supported APIs so far\n\nSee the outline of [supported APIs](./supported-APIs.md).\n\n# Usage\n\nFirst you should get familiar with AssemblyScript and learn how to run\nAssemlyScript code in a browser.\n\nThe following `asc` compiler options are required: `--exportRuntime`,\n`--exportTable`.\n\nThe `--explicitStart` option is required only if any of your ES modules use DOM\nAPIs at their top level (read the comments in the below example).\n\nIn your JavaScript code that loads your Wasm module, import `Asdom` and pass\nits `wasmImports` to your Wasm module's imports. The following snippet assumes\nthe use of native ES Modules in the browser and a static HTTP server serving\nfiles at the root of a project that has `node_modules`:\n\n```js\nimport {Asdom} from './node_modules/asdom/glue/index.js'\nimport {instantiate} from './node_modules/@assemblyscript/loader/index.js'\n\nasync function main() {\n\t// Create an Asdom instance containing the glue code for DOM APIs.\n\tconst asdom = new Asdom()\n\n\tconst {exports} = await instantiate(fetch('/build/untouched.wasm'), {\n\t\t// Pass the wasmImports in.\n\t\t...asdom.wasmImports,\n\n\t\t// ...Add any other imports your apps needs as usual...\n\t})\n\n\t// Before you do anything, pass the the Wasm module's exports to asdom.\n\tasdom.wasmExports = exports\n\n\t// Now execute the Wasm module. Make sure you use the `--explicitStart`\n\t// compiler option so that a `_start()` method is automatically exported if\n\t// you will have any code that uses DOM APIs at the top level of any ES\n\t// module (i.e. top level of any file). Otherwise, you could skip using the\n\t// `--explicitStart` option and export your own method(s) to call, but in\n\t// that case you should not use any DOM APIs at the top level of any\n\t// modules or else the glue code won't be ready because asdom.wasmImports\n\t// will not be set by the time the top level of modules execute.\n\texports._start()\n\n\t// If you didn't use `--explicitStart`, you can call your own export instead,\n\t// assuming no top-level ES module code uses DOM APIs, f.e.\n\t// exports.whatever()\n}\n\nmain()\n```\n\nIf you use a tool like Webpack or Rollup to bundle your application, or if you\nknow how to write import maps for native ES Modules, then you can use\nNode.js-style import specifiers instead:\n\n```js\nimport {Asdom} from 'asdom/glue/index.js'\nimport {instantiate} from '@assemblyscript/loader/index.js'\n```\n\nNow in your AssemblyScript code, re-export the AssemblyScript glue, and then\nyou can import `document` or `window` from `asdom` to start manipulating the\nDOM:\n\n```ts\n// Export AssemblyScript-side glue code or not everything will work (for example the customElements API).\nexport * from '../node_modules/asdom/assembly/glue'\n\nimport {document} from '../node_modules/asdom/assembly/index'\n\nconst el = document.createElement('h1')\n\nel.setAttribute('foo', 'bar')\n\nconst s: string = el.getAttribute('foo')! // returns \"bar\"\n\nel.innerHTML = /*html*/ `\n  \u003cspan style=\"font-weight: normal; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%)\"\u003e\n    \u003cem\u003ehello\u003c/em\u003e from \u003cstrong\u003eAssemblyScript\u003c/strong\u003e\n  \u003c/span\u003e\n`\n\ndocument.body!.appendChild(el)\n```\n\n# Caveats\n\n- Don't create built-in elements (f.e. `\u003cdiv\u003e` elements) using their\n  constructors. For example, don't do `new HTMLDivElement`, instead use\n  `document.createElement('div')`, or things won't work as expected.\n- AS does not yet support referencing constructors, but the Custom Elements API\n  is one that accepts a constructor as the second argument to\n  `customElements.define('tag-name', YourClass)`. To work around this\n  limitation, the `define()` API should be used like so:\n  ```js\n  customElements.define('tag-name', () =\u003e new YourClass(), YourClass.observedAttributes)\n  ```\n  As with built-in elements, do not manually `new` your custom element class,\n  except in the factory function that you pass into `customElements.define()`\n  as the second arg. In other scenarios when you want a ref to your custom\n  element, you can use any pattern that grabs your element from the DOM instead\n  of creating it with `new`.\n  ```js\n  const temp = document.createElement('\u003cdiv\u003e')\n  temp.innerHTML = '\u003cyour-element\u003e\u003c/your-element\u003e'\n  const yourElement = temp.firstElementChild\n  // ...use yourElement...\n  ```\n  This will be improved.\n\n# TODO\n\nWe will add more DOM APIs as needed while we chisel away.\n\n- [ ] Improve custom element API to allow directly creating custom element\n      instances from their constructors.\n- [ ] Use as-pect for testing.\n- [ ] Import jsdom or undom so that DOM APIs are mocked (on the JavaScript\n      side) during testing (as-pect runs in Node.js not a browser).\n- [ ] Make `window` and any of its properties global. Currently making AS\n      globals is incompatible with TypeScript, so VS Code intellisense doesn't pick\n      up AS globals (https://github.com/AssemblyScript/assemblyscript/issues/1929)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flume%2Fasdom","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flume%2Fasdom","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flume%2Fasdom/lists"}