{"id":21462791,"url":"https://github.com/mandrasch/not-a-real-screenreader","last_synced_at":"2025-10-30T22:05:59.127Z","repository":{"id":50085720,"uuid":"368352496","full_name":"mandrasch/not-a-real-screenreader","owner":"mandrasch","description":"Experimental test tool for screenreader output of websites. Operate a (very simple) node-based screenreader without keyboard shortcuts, just buttons.","archived":false,"fork":false,"pushed_at":"2022-07-29T17:04:01.000Z","size":6900,"stargazers_count":4,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2023-03-24T11:43:14.876Z","etag":null,"topics":["a11y","screenreader"],"latest_commit_sha":null,"homepage":"","language":"CSS","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/mandrasch.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":"2021-05-18T00:04:57.000Z","updated_at":"2022-07-29T17:04:06.000Z","dependencies_parsed_at":"2022-09-17T04:41:40.857Z","dependency_job_id":null,"html_url":"https://github.com/mandrasch/not-a-real-screenreader","commit_stats":null,"previous_names":[],"tags_count":null,"template":null,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mandrasch%2Fnot-a-real-screenreader","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mandrasch%2Fnot-a-real-screenreader/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mandrasch%2Fnot-a-real-screenreader/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mandrasch%2Fnot-a-real-screenreader/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mandrasch","download_url":"https://codeload.github.com/mandrasch/not-a-real-screenreader/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":226012187,"owners_count":17559651,"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":["a11y","screenreader"],"created_at":"2024-11-23T07:16:52.736Z","updated_at":"2025-10-30T22:05:54.079Z","avatar_url":"https://github.com/mandrasch.png","language":"CSS","readme":"# Not a real screenreader\n*Operate a (very simple) node-based screenreader without keyboard shortcuts*\n\nStatus: Experimental / Use at your own risk 👷\n\n\u003cp align=\"center\"\u003e\n  \u003cimg src=\"screenshot1.png\" width=\"45%\" alt=\"Screenshot of application window - form with website url\"\u003e\n\u0026nbsp; \u0026nbsp; \u0026nbsp; \u0026nbsp;\n  \u003cimg src=\"screenshot2.png\" width=\"45%\" alt=\"Screenshot of control center window - buttons for next and previous focusable item, buttons for reading next or previous elements\"\u003e\n\u003c/p\u003e\n\n## Demo\n\n🎥   Demo video: https://www.youtube.com/watch?v=YJ8tQs6Nz50\n\n## Install\n\nSee [Releases](https://github.com/mandrasch/not-a-real-screenreader/releases) to download it for your operating system.\n\n## For Devs\n\n- `npm install`\n- `npm start`\n\n## Build\n\n- `yarn build` (electron-builder recommends yarn)\n\nTested with node v14.17.3 (LTS)\n\n## Background story\n\nIn last fall I started working as web developer again. Web Accessibility is now part of my daily job, so I needed to learn fast. A big struggle I had at first was operating screenreader software. There are just a lot of keyboard shortcuts to learn while I just wanted to get a basic feeling of how a website is read to screenreader users. Like \"Does the screenreader even recognize my button?!\".  I'm not sure, but maybe a lot of developers postpone learning a11y skills because of this initial hurdle? (Yes, lame excuse, I know!)\n\n*Not a real screenreader* is an attempt to provide a simple learning and test tool for a11y-beginners. There is no need to learn keyboard shortcuts, the (very rudimentary and basic) screenreader is operated with buttons. \n\nDisclaimer: I'm an a11y newbie. I try to respect *Nothing About Us Without Us* as much as possible. Feedback is very welcome. :-)\n\nSee as well:\n\n- https://github.com/mandrasch/screenreader-remote-control\n- Touch Portal https://twitter.com/m_andrasch/status/1551823322333184001\n\n## Current limitations\n\n- does not work with child-Ids currently\n- does not support going into subgroups, very basic implementation\n- does not check for expanded=true/false yet\n- does not support form input (text input) yet\n- speech output has no language support, maybe use another library for speech output?\n- does not support all focus changes yet\n- current URL is not updated on page change\n- Problem with minimizing the window on mac\n- Not tested on windows/linux yet\n- and a lot of other problems 😬\n\n⚠️ Always use a real screenreader for serious accessibility testing! This is just an experimental learning tool for web accessibility. ⚠️\n\n## Open Source tech stack\n\n- electron\n- puppeteer\n- puppeteer-in-electron\n- say, chalk, bulma CSS, etc.\n\n### Example output of accessibility tree\n\nPuppeteer allows accessing the accessibility tree since version 3.0.0. See [accessibility.snapshot()](https://pptr.dev/#?product=Puppeteer\u0026version=v9.1.1\u0026show=api-class-accessibility). Unfortunately there is no DOM-reference given right now. Therefore [this workaround by dtinth](https://github.com/puppeteer/puppeteer/issues/3641#issuecomment-655639166) is used right now in this prototype.\n\n```\nCurrent focused element in WebArea: {\n  nodeId: '7014',\n  ignored: false,\n  role: { type: 'role', value: 'button' },\n  name: {\n    type: 'computedString',\n    value: 'JavaScript',\n    sources: [ [Object], [Object], [Object], [Object] ]\n  },\n  properties: [\n    { name: 'focusable', value: [Object] },\n    { name: 'focused', value: [Object] },\n    { name: 'expanded', value: [Object] }\n  ],\n  childIds: [ '7243' ],\n  backendDOMNodeId: 53\n} nodeId 7014\n```\n\n## Alternatives\n\n- Screenreader usage in browser https://assistivlabs.com/\n\n## License\n\nMy own scripts are available as CC0 (https://creativecommons.org/publicdomain/zero/1.0/deed.de). Please see package.json for a list of Open Source Libraries used (and their respective license). I'll provide a LICENSE and CREDITS file in future.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmandrasch%2Fnot-a-real-screenreader","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmandrasch%2Fnot-a-real-screenreader","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmandrasch%2Fnot-a-real-screenreader/lists"}