{"id":20945758,"url":"https://github.com/sphinxknight/compat-tester","last_synced_at":"2025-05-14T01:31:44.580Z","repository":{"id":57204610,"uuid":"121128374","full_name":"SphinxKnight/compat-tester","owner":"SphinxKnight","description":"NPM package to statically analyze the compatibility of a web page across a given browser scope","archived":false,"fork":false,"pushed_at":"2023-02-21T01:52:18.000Z","size":41,"stargazers_count":27,"open_issues_count":8,"forks_count":8,"subscribers_count":4,"default_branch":"master","last_synced_at":"2024-11-12T19:43:49.064Z","etag":null,"topics":["compatibility","mdn-data","nodejs"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/compat-tester","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/SphinxKnight.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":"2018-02-11T13:54:12.000Z","updated_at":"2024-06-12T07:57:12.000Z","dependencies_parsed_at":"2022-09-18T00:51:19.140Z","dependency_job_id":null,"html_url":"https://github.com/SphinxKnight/compat-tester","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/SphinxKnight%2Fcompat-tester","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SphinxKnight%2Fcompat-tester/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SphinxKnight%2Fcompat-tester/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SphinxKnight%2Fcompat-tester/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/SphinxKnight","download_url":"https://codeload.github.com/SphinxKnight/compat-tester/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225269699,"owners_count":17447572,"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":["compatibility","mdn-data","nodejs"],"created_at":"2024-11-18T23:49:41.873Z","updated_at":"2024-11-18T23:49:42.967Z","avatar_url":"https://github.com/SphinxKnight.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# compat-tester\n\n`compat-tester` is a static tool analysis that, provided a \"browser scope\", scans HTML, CSS and JS files and outputs a compatibility report for features that might not be available for such a scope (e.g. if my scope contains IE8 and my `style.css` stylesheet contains CSS Grid properties).\n\n`compat-tester`'s approach is pretty naive and currently doesn't detect any [progressive enhancement](https://christianheilmann.com/2012/02/16/stumbling-on-the-escalator/), polyfills, etc. that could improve actual compatibility.\n\n\nThis tool is heavily built upon:\n* [`mdn-browser-compat-data`](https://www.npmjs.com/package/mdn-browser-compat-data) from MDN team, please [contribute](https://developer.mozilla.org/docs/MDN/Contribute/Structures/Compatibility_tables) so that more data is available :)\n* [`htmlparser2`](https://www.npmjs.com/package/htmlparser2) for parsing HTML\n* [`css-tree`](https://www.npmjs.com/package/css-tree) for parsing CSS\nThanks to them for doing the heavy work :)\n\n**This project must be considered as alpha-stage.**\n\n## Install\n\n    npm install compat-tester\n\n## Usage\n\n\n\n### As an command line tool\n    \n    compat-tester # Scans index.html as root file and uses scope.json as defaults\n    compat-tester mySite.html myScope.json\n    compat-tester https://developer.mozilla.org/en-US/ myScope.json # Scans the remote web page\n    compat-tester -html myPage.html myScope.json  # Only scans the HTML of myPage.html\n    compat-tester -css myStyle.css myScope.json   # Only scans the CSS of myStyle.css\n    compat-tester -js myScript.js myScope.json    # !Not implemented yet! Only scans myScript.js\n\n### As a module \n\n    const compatTester = require(\"compat-tester\");\n    const options = {\"contrib\": \"all\"} // \"all\"|\"true\"|\"null\"\n    let report = compatTester.cssStringAnalyzer(string, browserScope, callback[, options ]);\n    let report = compatTester.cssFileAnalyzer(filePath, browserScope, callback[, options ]);\n    let report = compatTester.htmlStringAnalyzer(string, browserScope, callback[, options ]);\n    let report = compatTester.htmlFileAnalyzer(filePath, browserScope, callback[, options ]);\n    let report = compatTester.jsStringAnalyzer(string, browserScope, callback[, options ]); // Not implemented yet\n    let report = compatTester.jsFileAnalyzer(filePath, browserScope, callback[, options ]); // Not implemented yet\n\n## Browser-scope file\n\nThe `scope.json` file is simply a JSON file where the keys are the identifiers of the browsers you want/need to support, following [mdn-browser-compat](https://github.com/mdn/browser-compat-data/blob/master/schemas/compat-data-schema.md#browser-identifiers)'s syntax and where the values are the minimum version you want/need to support.\nFor instance with the following `scope.json`\n\n    {\n        \"ie\":\"8\",\n        \"firefox\":\"34\"\n    }\n\n`compat-tester` will report any detected feature that isn't available before Internet Explorer 8 and Firefox 34.\n\n## Examples\nUsing an scope with IE \"1\" (not a typo ;)) and Firefox \"8\", the report might look like:\n\n    HTML Report:\n            firefox incompatible - @index.html#L21 - \u003clink\u003e - attrcrossorigin - minVer: 18\n            firefox incompatible - @index.html#L21 - \u003clink\u003e - attrintegrity not implemented\n            firefox incompatible - @index.html#L99 - \u003clink\u003e - attrcrossorigin - minVer: 18\n            firefox incompatible - @index.html#L186 - \u003cdetails\u003e - minVer: 49\n            ie incompatible - @index.html#L21 - \u003clink\u003e - attrcrossorigin not implemented\n            ie incompatible - @index.html#L21 - \u003clink\u003e - attrintegrity not implemented\n            ie incompatible - @index.html#L99 - \u003clink\u003e - attrcrossorigin not implemented\n            ie incompatible - @index.html#L117 - \u003cheader\u003e - minVer: 9\n            ie incompatible - @index.html#L186 - \u003cdetails\u003e not implemented\n    CSS Report:\n            firefox incompatible - @test_files/style.css#L191 - Property: animation - minVer: 16\n            firefox incompatible - @test_files/style.css#L477 - Property: word-wrap - minVer: 49\n            firefox incompatible - @test_files/style.css#L485 - Property: font-variant-ligatures - minVer: 34\n            firefox incompatible - @test_files/style.css#L489 - Property: word-wrap - minVer: 49\n            firefox incompatible - @test_files/style.css#L491 - Property: word-break - minVer: 15\n            firefox incompatible - @test_files/style.css#L522 - Property: box-sizing - minVer: 29\n            firefox incompatible - @test_files/style.css#L686 - Property: box-sizing - minVer: 29\n            firefox incompatible - @test_files/style.css#L941 - Property: transform - minVer: 16\n            ie incompatible - @test_files/style.css#L49 - Property: background-color - minVer: 4\n            ie incompatible - @test_files/style.css#L54 - Property: background-color - minVer: 4\n            ie incompatible - @test_files/style.css#L58 - Property: content - minVer: 8\n            ie incompatible - @test_files/style.css#L62 - Property: font-weight - minVer: 3\n            …\n\n## Limitations - Wishlist\nThe following features are currently missing :'(\n\n### CSS\n(*current feature set: properties, @-rules*)\n* Selectors\n\n### JavaScript\n(*current feature set: nothing*)\n* Parsing JS and dealing with primary features like statements, operators\n\n### Misc.\n* Resolving a tree of resources (e.g. fetch internal HTML pages, CSS with @import…)\n* Adding comments to locally disable warnings\n* An interactive CLI to easily create a `scope.json` file (something like \"compat-tester --init\")\n* Tests\n\n### Integration\n* Addon for VSCode\n* Addon for SublimeText\n\n## Notes \nThis project is one of my first \"real\" JavaScript project, feel free to add [issues](https://github.com/SphinxKnight/compat-tester/issues) if you see any minor/major/confusing/horrendous stuff.","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsphinxknight%2Fcompat-tester","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsphinxknight%2Fcompat-tester","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsphinxknight%2Fcompat-tester/lists"}