Netflix interferes with Safari custom tab change shortcut?

Question

I used this method to set the tab-changing shortcut in Safari to Cmd+Opt+Left/Right (same as in Chrome). It works, except that when I'm watching Netflix and try changing tabs while the video is playing, it registers only as left/right and makes the video jump backward/forward by 10 seconds, instead of changing tabs as intended.

Is there a way to fix this? I would like Cmd+Opt+Left/Right to always change tabs, even if the webpage I'm on has specific behavior for the left/right keys on their own.

Strangely, Youtube does not have this issue, even though the left/right keys have similar behavior for the Youtube video player.

Answer 1

Using hammerspoon. After installing hammerspoon (I used brew cask install hammerspoon), just edit/create the file ~/.hammerspoon/init.lua to include:

left = hs.hotkey.new({"cmd", "alt"}, "left", function()
  hs.eventtap.keyStroke({"cmd", "shift"}, "[")
end)

right = hs.hotkey.new({"cmd", "alt"}, "right", function()
  hs.eventtap.keyStroke({"cmd", "shift"}, "]")
end)

hs.application.watcher.new(function(appName, eventType, appObject)
  if appName == "Safari" then
    if eventType == hs.application.watcher.activated then
      left:enable()
      right:enable()
    elseif eventType == hs.application.watcher.deactivated then
      left:disable()
      right:disable()
    end
  end
end):start()

Then start Hammerspoon.app.

Then enable Hammerspoon control in System Preferences > Security & Privacy > Privacy > Accessibility. (Maybe you will need to Reload Config from Hammerspoon's menu bar item after this).

Answer 2

Using Karabiner-Elements, you can remap cmd-alt-arrow to the Safari equivalent. I have tested, and confirmed this solves your Netflix problem.

I used brew cask install karabiner-elements to install Karabiner Elements. You can also use the installer from their website.

You need to make a new complex modification in Karabiner-Elements with these contents:

{
  "title": "Custom Safari Tab Navigation",
  "rules": [
    {
      "description": "Use Chrome keyboard shortcuts in Safari.",
      "manipulators": [
        {
          "type": "basic",
          "from": {
            "key_code": "left_arrow",
            "modifiers": {
              "mandatory": [ "command", "option" ]
            }
          },
          "to": [{
            "key_code": "open_bracket",
            "modifiers": [ "command", "shift" ]
          }],
          "conditions": [
            {
              "type": "frontmost_application_if",
              "bundle_identifiers": [
                "^com\\.apple\\.Safari$"
              ]
            }
          ]
        },
        {
          "type": "basic",
          "from": {
            "key_code": "right_arrow",
            "modifiers": {
              "mandatory": [
                "command",
                "option"
              ]
            }
          },
          "to": [{
            "key_code": "close_bracket",
            "modifiers": [ "command", "shift" ]
          }],
          "conditions": [
            {
              "type": "frontmost_application_if",
              "bundle_identifiers": [
                "^com\\.apple\\.Safari$"
              ]
            }
          ]
        }
      ]
    }
  ]
}

Complex modifications are stored in JSON files in ~/.config/karabiner/assets/complex_modifications.

You could copy the above into your clipboard, then

pbpaste > ~/.config/karabiner/assets/complex_modifications/chromelike_change_tab.json

Or go about adding a JSON file inside of that folder with these contents yourself.

Then inside of Karabiner-Elements.app you can navigate to Complex modifications using the bar at the top, click Add Rule in the bottom-left, then enable the "Use Chrome keyboard shortcuts in Safari" rule.

Answer 3

Using a userscript:

// ==UserScript==
// @name        NewScript-k5v43
// @description This is your new userscript, start writing code
// @match       https://www.netflix.com/watch/*
// ==/UserScript==

function ignoreChromeTabChange(event) {
  const left = 37;
  const right = 39;
  if ([left, right].includes(event.keyCode)
    && event.getModifierState('Meta') // Meta is CMD
    && event.getModifierState('Alt')) {
    event.stopPropagation();
  }
};

window.addEventListener('keydown', ignoreChromeTabChange, true);

You'll have to have a userscript manager, and the go-to Tampermonkey costs money for Safari now.

I tested using the free open source app userscripts. I guess you could use it too if you don't yet have a preferred userscript manager.