{"id":16331091,"url":"https://github.com/steelydylan/html-browser-tester","last_synced_at":"2025-03-20T23:30:18.396Z","repository":{"id":63061662,"uuid":"564977888","full_name":"steelydylan/html-browser-tester","owner":"steelydylan","description":"Run e2e tests on browsers without Node.js","archived":false,"fork":false,"pushed_at":"2024-05-03T11:53:11.000Z","size":69,"stargazers_count":6,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-17T16:55:29.098Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"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/steelydylan.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":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-11-12T00:52:34.000Z","updated_at":"2024-11-01T02:45:20.000Z","dependencies_parsed_at":"2024-05-03T12:58:51.922Z","dependency_job_id":"64454804-3002-4bf9-a508-f871bc7cee40","html_url":"https://github.com/steelydylan/html-browser-tester","commit_stats":{"total_commits":23,"total_committers":1,"mean_commits":23.0,"dds":0.0,"last_synced_commit":"5bf68a7968179fa211945be61960d8d06ee255ee"},"previous_names":[],"tags_count":15,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steelydylan%2Fhtml-browser-tester","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steelydylan%2Fhtml-browser-tester/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steelydylan%2Fhtml-browser-tester/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steelydylan%2Fhtml-browser-tester/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/steelydylan","download_url":"https://codeload.github.com/steelydylan/html-browser-tester/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244710183,"owners_count":20497210,"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":[],"created_at":"2024-10-10T23:25:32.397Z","updated_at":"2025-03-20T23:30:18.073Z","avatar_url":"https://github.com/steelydylan.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# HTML Browser Tester\n\nHTML Based browser tester without Node.js, Especially for HTML, CSS tests\n\n## Install\n\n```\nnpm install html-browser-tester\n```\n\n## Example\n\n```js\nimport { BrowserTester } from 'html-browser-tester'\n\nconst html = `\n  \u003c!DOCTYPE html\u003e\n  \u003chtml lang=\"ja\"\u003e\n  \u003chead\u003e\n    \u003cmeta charset=\"UTF-8\"\u003e\n    \u003cmeta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\"\u003e\n    \u003cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"\u003e\n    \u003ctitle\u003eHello\u003c/title\u003e\n    \u003cstyle\u003e\n      h1 {\n        color: #000;\n      }\n    \u003c/style\u003e\n  \u003c/head\u003e\n  \u003cbody\u003e\n    \u003ch1\u003eTitle1\u003c/h1\u003e\n    \u003ch2\u003eTitle2\u003c/h2\u003e\n  \u003c/body\u003e\n  \u003c/html\u003e\n`\n\nconst main = async () =\u003e {\n  const browserTester = new BrowserTester({ html, width: 980, height: 980 })\n\n  browserTester.test('h1,h2 textContent should have right textContent', async (_, doc) =\u003e {\n    const h1 = doc.querySelector('h1')\n    const h2 = doc.querySelector('h2')\n    browserTester.expect(h1?.textContent).toBe('Title1')\n    browserTester.expect(h2?.textContent).toBe('Title2')\n  })\n\n  browserTester.test('title should have right textContent', async (_, doc) =\u003e {\n    const title = doc.querySelector('title')\n    browserTester.expect(title?.textContent).toBe('Hello')\n  })\n\n  browserTester.test('h2 should have red text', async (window, doc) =\u003e {\n    const h2 = doc.querySelector('h2')\n    browserTest.expect(window.getComputedStyle(h2).color).toBe('rgb(255, 0, 0)')\n  })\n\n  const results = await browserTester.run()\n\n  console.log(results)\n  /*\n   [\n    { description: 'h1,h2 textContent should have right textContent', result: true },\n    { description: 'title should have right textContent', result: true },\n    { description: 'h2 should have red text', result: true }\n   ]\n  */\n}\n\nmain()\n```\n\n### Evaluate\n\nYou can also evaluate template literals to run tests\n\n```js\nbrowserTest.evaluate(`\n  test('h1,h2 textContent should have right textContent', async (_, doc) =\u003e {\n    const h1 = doc.querySelector('h1')\n    const h2 = doc.querySelector('h2')\n    expect(h1?.textContent).toBe('Title1')\n    expect(h2?.textContent).toBe('Title2')\n  })\n\n  test('title should have right textContent', async (_, doc) =\u003e {\n    const title = doc.querySelector('title')\n    expect(title?.textContent).toBe('Hello')\n  })\n\n  test('h2 should have red text', async (window, doc) =\u003e {\n    const h2 = doc.querySelector('h2')\n    expect(window.getComputedStyle(h2).color).toBe('rgb(255, 0, 0)')\n  })\n`)\nconst results = await browserTester.run()\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsteelydylan%2Fhtml-browser-tester","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsteelydylan%2Fhtml-browser-tester","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsteelydylan%2Fhtml-browser-tester/lists"}