From 4c69c7e34f77771cb39bfcdcef1a3d5fa0b04c97 Mon Sep 17 00:00:00 2001
From: gerjanvangeest <gerjanvangeest@users.noreply.github.com>
Date: Tue, 16 Apr 2024 15:16:40 +0200
Subject: [PATCH] chore: update eslint-plugin-lit-a11y version (#2259)

---
 .../combobox/src/gh-combobox/gh-combobox.js   |  2 +-
 .../src/google-combobox/google-combobox.js    |  2 +-
 package-lock.json                             | 94 +++++++++++++++++--
 package.json                                  |  2 +-
 .../form-group/FormGroupMixin.suite.js        |  2 +-
 .../overlays/test/local-positioning.test.js   | 34 +++----
 .../test/utils-tests/contain-focus.test.js    |  4 +-
 .../test/utils-tests/deep-contains.test.js    |  6 +-
 .../get-focusable-elements.test.js            |  2 +-
 9 files changed, 107 insertions(+), 41 deletions(-)

diff --git a/docs/components/combobox/src/gh-combobox/gh-combobox.js b/docs/components/combobox/src/gh-combobox/gh-combobox.js
index 5b40a91f3..c4c6a47e5 100644
--- a/docs/components/combobox/src/gh-combobox/gh-combobox.js
+++ b/docs/components/combobox/src/gh-combobox/gh-combobox.js
@@ -285,7 +285,7 @@ export class GhCombobox extends LionCombobox {
   render() {
     return html`
       <slot name="selection-display"></slot>
-      <div id="overlay-content-node-wrapper" role="dialog">
+      <div id="overlay-content-node-wrapper" role="dialog" aria-label="branches and tags">
         <div class="gh-combobox">
           <div class="form-field__group-one">
             <div class="gh-section-wrapper">${this._groupOneTemplate()}</div>
diff --git a/docs/components/combobox/src/google-combobox/google-combobox.js b/docs/components/combobox/src/google-combobox/google-combobox.js
index adfafb1d2..128bb78b5 100644
--- a/docs/components/combobox/src/google-combobox/google-combobox.js
+++ b/docs/components/combobox/src/google-combobox/google-combobox.js
@@ -347,7 +347,7 @@ export class GoogleCombobox extends LionCombobox {
    */
   _overlayListboxTemplate() {
     return html`
-      <div id="overlay-content-node-wrapper" role="dialog">
+      <div id="overlay-content-node-wrapper" role="dialog" aria-label="search predictions">
         <slot name="listbox"></slot>
         ${this._googleSearchBtnsTemplate()}
         <div class="google-search-report"><a href="#">Report inappropriate predictions</a></div>
diff --git a/package-lock.json b/package-lock.json
index b9dcda5ac..19006a322 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -54,7 +54,7 @@
         "eslint-config-prettier": "^9.1.0",
         "eslint-plugin-import": "^2.29.1",
         "eslint-plugin-lit": "^1.11.0",
-        "eslint-plugin-lit-a11y": "^2.4.0",
+        "eslint-plugin-lit-a11y": "^4.1.2",
         "eslint-plugin-wc": "^2.1.0",
         "globby": "^13.1.3",
         "husky": "^6.0.0",
@@ -3276,6 +3276,34 @@
         "eslint-plugin-wc": "^1.2.0"
       }
     },
+    "node_modules/@open-wc/eslint-config/node_modules/emoji-regex": {
+      "version": "10.3.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.3.0.tgz",
+      "integrity": "sha512-QpLs9D9v9kArv4lfDEgg1X/gN5XLnf/A6l9cs8SPZLRZR3ZkY9+kwIQTxm+fsSej5UMYGE8fdoaZVIBlqG0XTw==",
+      "dev": true
+    },
+    "node_modules/@open-wc/eslint-config/node_modules/eslint-plugin-lit-a11y": {
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-lit-a11y/-/eslint-plugin-lit-a11y-2.4.1.tgz",
+      "integrity": "sha512-UljRja/2cVrNtgnCDj5sCT3Larxda4mGqbsPhlksvECo0+KCD8EuUori/P6wFeFqk+pHlkIC3W200E5q85E3VQ==",
+      "dev": true,
+      "dependencies": {
+        "aria-query": "^5.1.3",
+        "axe-core": "^4.3.3",
+        "axobject-query": "^2.2.0",
+        "dom5": "^3.0.1",
+        "emoji-regex": "^10.2.1",
+        "eslint-plugin-lit": "^1.6.0",
+        "eslint-rule-extender": "0.0.1",
+        "language-tags": "^1.0.5",
+        "parse5": "^7.1.2",
+        "parse5-htmlparser2-tree-adapter": "^6.0.1",
+        "requireindex": "~1.2.0"
+      },
+      "peerDependencies": {
+        "eslint": ">= 5"
+      }
+    },
     "node_modules/@open-wc/eslint-config/node_modules/eslint-plugin-wc": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/eslint-plugin-wc/-/eslint-plugin-wc-1.5.0.tgz",
@@ -3289,6 +3317,18 @@
         "eslint": ">=5"
       }
     },
+    "node_modules/@open-wc/eslint-config/node_modules/parse5": {
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.1.2.tgz",
+      "integrity": "sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==",
+      "dev": true,
+      "dependencies": {
+        "entities": "^4.4.0"
+      },
+      "funding": {
+        "url": "https://github.com/inikulin/parse5?sponsor=1"
+      }
+    },
     "node_modules/@open-wc/rollup-plugin-html": {
       "version": "1.2.5",
       "dev": true,
@@ -9476,9 +9516,9 @@
       }
     },
     "node_modules/eslint-plugin-lit-a11y": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-lit-a11y/-/eslint-plugin-lit-a11y-2.4.1.tgz",
-      "integrity": "sha512-UljRja/2cVrNtgnCDj5sCT3Larxda4mGqbsPhlksvECo0+KCD8EuUori/P6wFeFqk+pHlkIC3W200E5q85E3VQ==",
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-lit-a11y/-/eslint-plugin-lit-a11y-4.1.2.tgz",
+      "integrity": "sha512-otrF1Q0uv6RUz/AflVgnf1rVzbfQJfgUmnB+xBl71IR8EwtJGEOrqGs3Ky/4APMda+maF6bsZLctppcz16m7Hw==",
       "dev": true,
       "dependencies": {
         "aria-query": "^5.1.3",
@@ -9486,7 +9526,7 @@
         "axobject-query": "^2.2.0",
         "dom5": "^3.0.1",
         "emoji-regex": "^10.2.1",
-        "eslint-plugin-lit": "^1.6.0",
+        "eslint-plugin-lit": "^1.10.1",
         "eslint-rule-extender": "0.0.1",
         "language-tags": "^1.0.5",
         "parse5": "^7.1.2",
@@ -21796,7 +21836,7 @@
     },
     "packages/ui": {
       "name": "@lion/ui",
-      "version": "0.6.1",
+      "version": "0.7.0",
       "license": "MIT",
       "dependencies": {
         "@bundled-es-modules/message-format": "^6.2.4",
@@ -24306,6 +24346,31 @@
         "eslint-plugin-wc": "^1.2.0"
       },
       "dependencies": {
+        "emoji-regex": {
+          "version": "10.3.0",
+          "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.3.0.tgz",
+          "integrity": "sha512-QpLs9D9v9kArv4lfDEgg1X/gN5XLnf/A6l9cs8SPZLRZR3ZkY9+kwIQTxm+fsSej5UMYGE8fdoaZVIBlqG0XTw==",
+          "dev": true
+        },
+        "eslint-plugin-lit-a11y": {
+          "version": "2.4.1",
+          "resolved": "https://registry.npmjs.org/eslint-plugin-lit-a11y/-/eslint-plugin-lit-a11y-2.4.1.tgz",
+          "integrity": "sha512-UljRja/2cVrNtgnCDj5sCT3Larxda4mGqbsPhlksvECo0+KCD8EuUori/P6wFeFqk+pHlkIC3W200E5q85E3VQ==",
+          "dev": true,
+          "requires": {
+            "aria-query": "^5.1.3",
+            "axe-core": "^4.3.3",
+            "axobject-query": "^2.2.0",
+            "dom5": "^3.0.1",
+            "emoji-regex": "^10.2.1",
+            "eslint-plugin-lit": "^1.6.0",
+            "eslint-rule-extender": "0.0.1",
+            "language-tags": "^1.0.5",
+            "parse5": "^7.1.2",
+            "parse5-htmlparser2-tree-adapter": "^6.0.1",
+            "requireindex": "~1.2.0"
+          }
+        },
         "eslint-plugin-wc": {
           "version": "1.5.0",
           "resolved": "https://registry.npmjs.org/eslint-plugin-wc/-/eslint-plugin-wc-1.5.0.tgz",
@@ -24315,6 +24380,15 @@
             "is-valid-element-name": "^1.0.0",
             "js-levenshtein-esm": "^1.2.0"
           }
+        },
+        "parse5": {
+          "version": "7.1.2",
+          "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.1.2.tgz",
+          "integrity": "sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==",
+          "dev": true,
+          "requires": {
+            "entities": "^4.4.0"
+          }
         }
       }
     },
@@ -28833,9 +28907,9 @@
       }
     },
     "eslint-plugin-lit-a11y": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-lit-a11y/-/eslint-plugin-lit-a11y-2.4.1.tgz",
-      "integrity": "sha512-UljRja/2cVrNtgnCDj5sCT3Larxda4mGqbsPhlksvECo0+KCD8EuUori/P6wFeFqk+pHlkIC3W200E5q85E3VQ==",
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-lit-a11y/-/eslint-plugin-lit-a11y-4.1.2.tgz",
+      "integrity": "sha512-otrF1Q0uv6RUz/AflVgnf1rVzbfQJfgUmnB+xBl71IR8EwtJGEOrqGs3Ky/4APMda+maF6bsZLctppcz16m7Hw==",
       "dev": true,
       "requires": {
         "aria-query": "^5.1.3",
@@ -28843,7 +28917,7 @@
         "axobject-query": "^2.2.0",
         "dom5": "^3.0.1",
         "emoji-regex": "^10.2.1",
-        "eslint-plugin-lit": "^1.6.0",
+        "eslint-plugin-lit": "^1.10.1",
         "eslint-rule-extender": "0.0.1",
         "language-tags": "^1.0.5",
         "parse5": "^7.1.2",
diff --git a/package.json b/package.json
index 5b834766f..8cd167409 100644
--- a/package.json
+++ b/package.json
@@ -82,7 +82,7 @@
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-import": "^2.29.1",
     "eslint-plugin-lit": "^1.11.0",
-    "eslint-plugin-lit-a11y": "^2.4.0",
+    "eslint-plugin-lit-a11y": "^4.1.2",
     "eslint-plugin-wc": "^2.1.0",
     "globby": "^13.1.3",
     "husky": "^6.0.0",
diff --git a/packages/ui/components/form-core/test-suites/form-group/FormGroupMixin.suite.js b/packages/ui/components/form-core/test-suites/form-group/FormGroupMixin.suite.js
index 934ac5e0e..b48ce3ff2 100644
--- a/packages/ui/components/form-core/test-suites/form-group/FormGroupMixin.suite.js
+++ b/packages/ui/components/form-core/test-suites/form-group/FormGroupMixin.suite.js
@@ -666,7 +666,7 @@ export function runFormGroupMixinSuite(cfg = {}) {
 
         await triggerFocusFor(hobbyInputNode);
         await triggerFocusFor(genderInputNode);
-        const button = /**  @type {FormGroup} */ (await fixture(html`<button></button>`));
+        const button = /**  @type {FormGroup} */ (await fixture(html`<button>Button</button>`));
         button.focus();
 
         expect(el.touched).to.be.true;
diff --git a/packages/ui/components/overlays/test/local-positioning.test.js b/packages/ui/components/overlays/test/local-positioning.test.js
index 5d1afe7ac..45aa75f64 100644
--- a/packages/ui/components/overlays/test/local-positioning.test.js
+++ b/packages/ui/components/overlays/test/local-positioning.test.js
@@ -75,7 +75,7 @@ describe('Local Positioning', () => {
         ),
         invokerNode: /** @type {HTMLElement} */ (
           fixtureSync(html`
-            <div role="button" style="width: 20px; height: 10px; background: orange;"></div>
+            <div role="button" style="width: 20px; height: 10px; background: orange;">Button</div>
           `)
         ),
       });
@@ -104,11 +104,9 @@ describe('Local Positioning', () => {
         ),
         invokerNode: /** @type {HTMLElement} */ (
           fixtureSync(html`
-            <div
-              role="button"
-              style="width: 100px; height: 20px;"
-              @click=${() => ctrl.show()}
-            ></div>
+            <div role="button" style="width: 100px; height: 20px;" @click=${() => ctrl.show()}>
+              Button
+            </div>
           `)
         ),
       });
@@ -129,11 +127,9 @@ describe('Local Positioning', () => {
         ),
         invokerNode: /** @type {HTMLElement} */ (
           fixtureSync(html`
-            <div
-              role="button"
-              style="width: 100px; height: 20px;"
-              @click=${() => ctrl.show()}
-            ></div>
+            <div role="button" style="width: 100px; height: 20px;" @click=${() => ctrl.show()}>
+              Button
+            </div>
           `)
         ),
         popperConfig: {
@@ -185,11 +181,9 @@ describe('Local Positioning', () => {
         ),
         invokerNode: /** @type {HTMLElement} */ (
           fixtureSync(html`
-            <div
-              role="button"
-              style="width: 100px; height: 20px;"
-              @click=${() => ctrl.show()}
-            ></div>
+            <div role="button" style="width: 100px; height: 20px;" @click=${() => ctrl.show()}>
+              Button
+            </div>
           `)
         ),
         popperConfig: {
@@ -257,11 +251,9 @@ describe('Local Positioning', () => {
         ),
         invokerNode: /** @type {HTMLElement} */ (
           fixtureSync(html`
-            <div
-              role="button"
-              style="width: 100px; height: 20px;"
-              @click=${() => ctrl.show()}
-            ></div>
+            <div role="button" style="width: 100px; height: 20px;" @click=${() => ctrl.show()}>
+              Button
+            </div>
           `)
         ),
         popperConfig: {
diff --git a/packages/ui/components/overlays/test/utils-tests/contain-focus.test.js b/packages/ui/components/overlays/test/utils-tests/contain-focus.test.js
index 216f442e4..2ad3c3fca 100644
--- a/packages/ui/components/overlays/test/utils-tests/contain-focus.test.js
+++ b/packages/ui/components/overlays/test/utils-tests/contain-focus.test.js
@@ -25,7 +25,7 @@ function simulateTabInWindow(elToRecieveFocus) {
 
 const interactionElementsNode = renderLitAsNode(html`
   <div>
-    <button id="el1"></button>
+    <button id="el1">Button</button>
     <a id="el2" href="#">foo</a>
     <div id="el3" tabindex="0"></div>
     <input id="el4" />
@@ -50,7 +50,7 @@ const lightDomAutofocusTemplate = html`
     <button id="outside-1">outside 1</button>
 
     <div id="rootElement">
-      <button id="el1"></button>
+      <button id="el1">Button</button>
       <a id="el2" href="#">foo</a>
       <div id="el3" tabindex="0"></div>
       <input id="el4" autofocus />
diff --git a/packages/ui/components/overlays/test/utils-tests/deep-contains.test.js b/packages/ui/components/overlays/test/utils-tests/deep-contains.test.js
index abd349012..d6e630723 100644
--- a/packages/ui/components/overlays/test/utils-tests/deep-contains.test.js
+++ b/packages/ui/components/overlays/test/utils-tests/deep-contains.test.js
@@ -17,7 +17,7 @@ describe('deepContains()', () => {
       await fixture(html`
         <div id="light">
           ${shadowElement}
-          <button id="light-el-1"></button>
+          <button id="light-el-1">Button</button>
         </div>
       `)
     );
@@ -65,7 +65,7 @@ describe('deepContains()', () => {
       await fixture(html`
         <div id="light">
           ${shadowElement} ${shadowElement2}
-          <button id="light-el-1"></button>
+          <button id="light-el-1">Button</button>
         </div>
       `)
     );
@@ -101,7 +101,7 @@ describe('deepContains()', () => {
       await fixture(html`
         <div id="light">
           ${shadowElement}
-          <button id="light-el-1"></button>
+          <button id="light-el-1">Button</button>
         </div>
       `)
     );
diff --git a/packages/ui/components/overlays/test/utils-tests/get-focusable-elements.test.js b/packages/ui/components/overlays/test/utils-tests/get-focusable-elements.test.js
index 3791f3635..f80ff0ac5 100644
--- a/packages/ui/components/overlays/test/utils-tests/get-focusable-elements.test.js
+++ b/packages/ui/components/overlays/test/utils-tests/get-focusable-elements.test.js
@@ -135,7 +135,7 @@ describe('getFocusableElements()', () => {
       class extends LitElement {
         render() {
           return html`
-            <button id="el-a-1"></button>
+            <button id="el-a-1">Button</button>
 
             <element-b marker="marker-1"></element-b>