Skip to content

Commit

Permalink
Moving to manifest v3 (#60)
Browse files Browse the repository at this point in the history 
* Convert extension to use Manifest v3

* Convert extension to use Manifest v3

* Convert extension to use Manifest v3

* Make message sender matching more explicit

* Fix settings tests

* Fix all e2e tests 🎉

* Separate TabRegistry from its factory to prevent unneeded dependencies in unit tests

* Update GitHub action to use the latest stable version of Node

* Don't close the first opened tab until the test suit is finished.

Without this GitHub action produce errors like `Protocol error (Target.closeTarget): Target closed.`

* Make finding of the active page code more readable

* Increase the delay between actions to fix the problem in tests.

Prevent closing of the first tab because it produces an error `Protocol error (Target.closeTarget): Target closed.`

* Improve tests stability and reduce delay between actions in CI pipline

* Restore tabs registry on extension reloads

* Log messages only in development mode

* Fix tabs sorting on initialization

* Popup stays open on mouse cursor movements

* Remove unnecessary nesting character in tests

* Register listeners in the first turn of the event loop.

This fixes the bug when the extension service worker is idle and the first shortcut command is not handled because the event listener is not triggered. More info https://developer.chrome.com/docs/extensions/mv3/migrating_to_service_workers/

* Add a note about the drawback of the current Ctrl+Tab config in Karabiner Elements

* Sort opened tabs using only URLs of the saved ones.

The page title may be changed any time and which will make the tabs sorting order invalid, so the usage of the URL only is more reliable.

* Set keyboard listeners to the window object

* Fix invalid access to uninitialized settings object

* Update CSS loaders

* Subscribe to the new page creation earlier

* Increase operation timeout for CI

* Log browser version on each e2e run

* Increase timeout for switching between pages

* God, please make those tests pass 🙏

* Map messages between page script and content script.

Wait for the tab to be activated.

* Fixed a couple of broken tests

* Make the e2e tests more stable

* Use new _favicon API that uses favicons cached by browser ([details](https://bugs.chromium.org/p/chromium/issues/detail?id=104102#c63)).
This allows us to show icons independently of network and CORS policies.

Fix empty icons for tabs that have equal URLs. The caching of icon elements was causing the issue.

Remove unnecessary icons for browser tabs like Settings, New Tab, History etc. Now the icons are always accessible.

* Ignore Intellij folder

* Move to yearly versioning.

Details https://blog.jetbrains.com/blog/2016/03/09/jetbrains-toolbox-release-and-versioning-changes/
  • Loading branch information
@dvdvdmt
dvdvdmt authored Aug 26, 2022
1 parent 1ffb5f5 commit fb4e7d6
Show file tree
Hide file tree
Showing 51 changed files with 1,746 additions and 1,493 deletions.
1 change: 1 addition & 0 deletions .eslintrc.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@ rules:
'@typescript-eslint/explicit-function-return-type': off
'@typescript-eslint/no-unused-vars': [error, {argsIgnorePattern: '^_', varsIgnorePattern: '^_'}]
'@typescript-eslint/member-delimiter-style': off
'@typescript-eslint/no-empty-function': [warn]
prefer-arrow-callback: off
object-curly-spacing: [error, never]
arrow-parens: [error, always]
Expand Down
6 changes: 3 additions & 3 deletions .github/workflows/main.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,9 @@ jobs:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1
- uses: actions/setup-node@v2
with:
node-version: "12.x"
node-version: 'lts/*'
- name: Install dependencies
run: npm ci
env:
Expand All @@ -24,4 +24,4 @@ jobs:
env:
CI: 'true'
with:
args: npm run test:e2e
args: npm run build:e2e && npm run test:e2e
1 change: 1 addition & 0 deletions .gitignore
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
node_modules/
.idea/
build*/
**/.DS_Store
.eslintcache
165 changes: 86 additions & 79 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,29 +1,27 @@
# Popup tab switcher #
# Popup tab switcher

![Popup tab switcher logo](./readme-assets/tab-switcher-logo.png)

A browser extension that makes switching between tabs more convenient.
Available in [Chrome web
store](https://chrome.google.com/webstore/detail/popup-tab-switcher/cehdjppppegalmaffcdffkkpmoflfhkc).
A browser extension that makes switching between tabs more convenient. Available in
[Chrome web store](https://chrome.google.com/webstore/detail/popup-tab-switcher/cehdjppppegalmaffcdffkkpmoflfhkc)
.

[![Popup tab switcher work demo](./readme-assets/youtube-preview.png)](https://youtu.be/qrDArVNr5j4)

It remembers the order in which tabs were active and allows you to
switch between recently active tabs in a fraction of a second without
using a mouse.
It remembers the order in which tabs were active and allows you to switch between recently active
tabs in a fraction of a second without using a mouse.

## Motivation ##
## Motivation

My everyday code editor from JetBrains has
a handful popup (Settings > Keymap > Switcher) that simplifies switching between
editor's tabs. A similar switcher is build into all modern operating systems,
which allows you to jump between apps and it can be triggered by pressing `Alt+Tab`
in Windows and `Cmd+Tab` in macOS.
The project is copying this behaviour to the Chrome browser.
My everyday code editor from JetBrains has a handful popup (Settings > Keymap > Switcher) that
simplifies switching between editor's tabs. A similar switcher is build into all modern operating
systems, which allows you to jump between apps and it can be triggered by pressing `Alt+Tab` in
Windows and `Cmd+Tab` in macOS. The project is copying this behaviour to the Chrome browser.

## How to use ##
## How to use

Default shortcuts to trigger the extension are:

<ul>
<li>
<code>Alt+Y</code> to select tabs from top to bottom (recent to old)
Expand All @@ -40,74 +38,83 @@ Default shortcuts to trigger the extension are:
</ul>

After you selected necessary tab, release the `Alt` key to activate it.
You can press `Escape` or click on the space around popup to hide it.

When you close a tab the extension will switch you to the previously active one.
It is more helpful than the default Chrome behaviour, which activates the adjacent tab.

## Restrictions ##
The extension tries to render its popup on the page wherever it is possible, but there are cases where it can't do that:
* Chrome's web store pages. The extension doesn't work here.
* Special Chrome tabs such as Settings, New tab, History, etc. In this case the extension tries to switch a user from a special tab to a previous tab without showing a popup.
* The page has no focus (a user searches on the page, focused on address bar, etc.). In this case the extension shows its popup and starts a timer by the end of which it will switch a user to the selected tab.
* File pages (URL starts with `file:///`). The extension can't work on such pages without a special permission which you can turn on in Extensions > Popup Tab Switcher (Details) > Allow access to file URLs.

## Help ##
### Settings ###
You can open the extension settings by clicking on its icon near the
address bar.

|Option|Description|
|---|---|
|Dark theme|Turns on or off the dark theme 🦇|
|Popup width|Sets the popup width|
|Popup height|Sets the popup height|
|Max number of tabs|Specifies how many recently used tabs to show in the popup|
|Font size|Sets the size of the tab title text|
|Icon size|Sets the size of the tab icon|
|Auto switching timeout|If a page has no focus (address bar or search field is focused, etc.) then the extension starts a timer by the end of which it will switch a user to the selected tab. This timer restarts on each selection command (`Alt+Y` or `Alt+Shift+Y` by default)|
|Text scroll delay|If a tab title is wider than the popup then its overflowing part will be hidden. When such a tab is selected its text will be scrolled. This option delays the start of the scrolling|
|Text scroll speed|Sets the speed of a selected tab text scrolling|
|Switch to a previously used tab|Switch to a previously active tab when a current one closes|
|Stay open|The switcher stays open and stops switching tabs on a modifier key release|

### Replace default tab switching behaviour ###
Default Chrome tab switching shortcuts are `Ctrl+Tab` and
`Ctrl+Shift+Tab`. These shortcuts can not be assigned to trigger the
extension commands (Extensions > Keyboard shortcuts
`chrome://extensions/shortcuts`). In order to switch between tabs on
`Ctrl+Tab` by using the extension you can try one of the next
approaches.

> NOTE: For the moment I know how to do it only for macOS, but I think
> that solution for Windows is similar and can be done with
> [AutoHotkey](https://www.autohotkey.com/).
#### macOS ####

##### Using Karabiner-Elements #####
[Karabiner-Elements](https://pqrs.org/osx/karabiner/index.html) is a
free keyboard customizer for macOS. After its installation you need to
place
You can press `Escape` or click on the space around popup to hide it.

When you close a tab the extension will switch you to the previously active one. It is more helpful
than the default Chrome behaviour, which activates the adjacent tab.

## Restrictions

The extension tries to render its popup on the page wherever it is possible, but there are cases
where it can't do that:

- Chrome's web store pages. The extension doesn't work here.
- Special Chrome tabs such as Settings, New tab, History, etc. In this case the extension tries to
switch a user from a special tab to a previous tab without showing a popup.
- The page has no focus (a user searches on the page, focused on address bar, etc.). In this case
the extension shows its popup and starts a timer by the end of which it will switch a user to the
selected tab.
- File pages (URL starts with `file:///`). The extension can't work on such pages without a special
permission which you can turn on in Extensions > Popup Tab Switcher (Details) > Allow access to
file URLs.

## Help

### Settings

You can open the extension settings by clicking on its icon near the address bar.

| Option | Description |
| ------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Dark theme | Turns on or off the dark theme 🦇 |
| Popup width | Sets the popup width |
| Popup height | Sets the popup height |
| Max number of tabs | Specifies how many recently used tabs to show in the popup |
| Font size | Sets the size of the tab title text |
| Icon size | Sets the size of the tab icon |
| Auto switching timeout | If a page has no focus (address bar or search field is focused, etc.) then the extension starts a timer by the end of which it will switch a user to the selected tab. This timer restarts on each selection command (`Alt+Y` or `Alt+Shift+Y` by default) |
| Text scroll delay | If a tab title is wider than the popup then its overflowing part will be hidden. When such a tab is selected its text will be scrolled. This option delays the start of the scrolling |
| Text scroll speed | Sets the speed of a selected tab text scrolling |
| Switch to a previously used tab | Switch to a previously active tab when a current one closes |
| Stay open | The switcher stays open and stops switching tabs on a modifier key release |

### Replace default tab switching behaviour

Default Chrome tab switching shortcuts are `Ctrl+Tab` and `Ctrl+Shift+Tab`. These shortcuts can not
be assigned to trigger the extension commands (Extensions > Keyboard shortcuts
`chrome://extensions/shortcuts`). In order to switch between tabs on `Ctrl+Tab` by using the
extension you can try one of the next approaches.

> NOTE: For the moment I know how to do it only for macOS, but I think that solution for Windows is
> similar and can be done with [AutoHotkey](https://www.autohotkey.com/).
#### macOS

##### Using Karabiner-Elements

[Karabiner-Elements](https://pqrs.org/osx/karabiner/index.html) is a free keyboard customizer for
macOS. After its installation you need to place
[this config file](https://github.com/dvdvdmt/my-configs/blob/master/karabiner/Chrome_Ctrl-Tab_to_Alt-Y.json)
to `~/.config/karabiner/assets/complex_modifications/` and enable this
modification in Karabiner-Elements Preferences (Complex Modifications >
Add rule > Maps switching between tabs in Chrome...).
to `~/.config/karabiner/assets/complex_modifications/` and enable this modification in
Karabiner-Elements Preferences (Complex Modifications > Add rule > Maps switching between tabs in
Chrome...). Karabiner has a bug that causes releasing `Ctrl` key on mouse movements
([details](https://github.com/pqrs-org/Karabiner-Elements/issues/978)), this results on instant
switching to another tab on mouse movements when the popup is open.

##### Using Keyboard Maestro #####
[Keyboard Maestro](https://www.keyboardmaestro.com/main/) is a powerful
macro runner for macOS. The solution with Keyboard Maestro works, but is
not ideal, because it starts timers in a background. You can find
necessary macroses in
[this forum question](https://forum.keyboardmaestro.com/t/how-to-map-one-key-combination-with-modifier-key-to-another/14385?u=dmitriy_davydov).
##### Using Keyboard Maestro

## FAQ ##
> Is there a way to change the default shortcut (Alt+Y)?
[Keyboard Maestro](https://www.keyboardmaestro.com/main/) is a powerful macro runner for macOS. The
solution with Keyboard Maestro works, but is not ideal, because it starts timers in a background.
You can find necessary macros in
[this forum question](https://forum.keyboardmaestro.com/t/how-to-map-one-key-combination-with-modifier-key-to-another/14385?u=dmitriy_davydov)
.

Yes you can do this in Chrome (Extensions > Keyboard shortcuts
`chrome://extensions/shortcuts`)
## FAQ

## Contributors ##
> Is there a way to change the default shortcut (Alt+Y)?
Design of the icon and promo images - [Alina Zaripova](https://www.behance.net/alicilinia)
Yes you can do this in Chrome (Extensions > Keyboard shortcuts `chrome://extensions/shortcuts`)

## Contributors

Design of the icon and promo images - [Alina Zaripova](https://www.behance.net/alicilinia)
Loading

0 comments on commit fb4e7d6

Please sign in to comment.