[ui] Dont show keyboard hints when a user is trying to take a screens…

…hot (#23365)

* Dont show keyboard hints when a user is trying to take a screenshot

* Oh hey metaKey is its own special thing

.changelog/23365.txt

@@ -0,0 +1,3 @@
+```release-note:bug
+ui: Dont show keyboard nav hints when taking a screenshot
+```

ui/app/services/keyboard.js

@@ -348,6 +348,10 @@ export default class KeyboardService extends Service {
       const shifted = event.getModifierState('Shift');
       if (type === 'press') {
         if (key === 'Shift') {
+          // if cmd/windows key is pressed, don't show hints — this is likely a user trying to take a screenshot.
+          if (event.getModifierState('Meta')) {
+            return;
+          }
           this.displayHints = true;
         } else {
           if (!DISALLOWED_KEYS.includes(key)) {

ui/tests/acceptance/keyboard-test.js

@@ -270,6 +270,18 @@ module('Acceptance | keyboard', function (hooks) {
         0,
         'Hints disappear when you release Shift'
       );
+
+      await triggerEvent('.page-layout', 'keydown', {
+        key: 'Shift',
+        metaKey: true,
+      });
+      assert.equal(
+        document.querySelectorAll('[data-test-keyboard-hint]').length,
+        0,
+        'Hints do not show up when holding down Command+Shift'
+      );
+      await triggerEvent('.page-layout', 'keyup', { key: 'Shift' });
+      await triggerEvent('.page-layout', 'keyup', { key: 'Meta' });
     });
   });