Keyboard Navigator: Go into TypeScript!
The main change in May was the installation of TypeScript in the repository. I’ve also splitted the code into few modules so it’s no more the whole logic stored in a single file.
There were 3 pull requests I merged:
Install TypeScript
In this pull request) I added a simple package.json file with typescript, webpack and ts-loader packages defined in “devDependencies” section.
The tsconfig.json file has a “DOM” library defined in “lib” setting to recognize the types coming from Document Object Model. Also, the “noImplicitAny” was set to “false” in order to not throw any errors about lacking types (this was improved in the next pull request Split code into modules).
The webpack.config.js is also pretty straightforward - it’s configfured to start within src/contentScript.ts file and load all .ts, *.tsx and *.js files imported from there using *ts-loader. The resulting, single file main-bundle.js, will be saved inside build/ local directory.
Split code into modules
The second pull request is about splitting the code, located till now in a single file contentScript.ts. The code there has already been divided into few modules (in a sense of JS module pattern) and it was reflected when splitting the code into separate files.
Beside of that, I’ve added typing in the codebase, defined few models like Highlight, Point or AppState, so the project could actually benefit from TypeScript.
Ignore key presses with modifiers
Very small pull request containing 1 change: keydown events are handled by the extension only when there are no modifier keys (Alt, Ctrl, Meta or Shift) pressed alongside with regular keys. Thanks to this change, when user presses e.g. Ctrl + F (search shortcut), no highlights are shown on the page.
What are the plans to do next?
This time I didn’t record any video, because the changes aren’t mostly visible to the end user. But, I will summarize the plans for developing Keyboard Navigator in the following weeks:
- improving the navigation algorithm (which is already in an advanced phase with proper pull request open)
- disabling the extension when user types text in inputs/textareas etc. to prevent accidental turning on highlights
- implement remembering the location of last selected highlight
If you’re interested in the latest news from developing this extension, please check the open source repo on Github. You can create issues or propose changes to contribute in this project if you want :)
Stay tuned, the next updates will appear soon!