From eb98e3862baf1cefce9f2f5df0359989290d74b9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pablo=20N=C3=BA=C3=B1ez?= Date: Thu, 12 Aug 2021 12:54:37 +0200 Subject: [PATCH 1/4] Prettier. --- examples/index.html | 157 +++++++++++++++++++++++--------------------- 1 file changed, 81 insertions(+), 76 deletions(-) diff --git a/examples/index.html b/examples/index.html index 5d985dd..ddafb49 100644 --- a/examples/index.html +++ b/examples/index.html @@ -1,85 +1,90 @@ - + - - - Codestin Search App - - - -

Base examples

+ + + Codestin Search App + + + +

Base examples

-
- Best robot: Unknown - - - - - -
+
+ Best robot: Unknown + + + + + +
-
- Best robot: Unknown - - - - - -
+
+ Best robot: Unknown + + + + + +
-
- Favorite robots - - - - - -
+
+ Favorite robots + + + + + +
-
- Favorite robots - - - - - -
+
+ Favorite robots + + + + + +
-

Autofocus example

-

summary may have autofocus so it's the initially focused element in the page.

-

Then any focusable element inside the popup can declare autofocus too, so it gets focus when the popup is opened.

+

Autofocus example

+

summary may have autofocus so it's the initially focused element in the page.

+

+ Then any focusable element inside the popup can declare autofocus too, so it gets focus when the popup is opened. +

-
- Autofocus picker - - - - - - -
+
+ Autofocus picker + + + + + + +
- - - - + + + + From 20a9a3a0314e37831842eca1ea3098b580991243 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pablo=20N=C3=BA=C3=B1ez?= Date: Thu, 12 Aug 2021 12:56:32 +0200 Subject: [PATCH 2/4] Add spans to better reproduce production scenarios. --- examples/index.html | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/examples/index.html b/examples/index.html index ddafb49..48ae4f7 100644 --- a/examples/index.html +++ b/examples/index.html @@ -39,11 +39,15 @@

Base examples

Best robot: Unknown - - - + + +
From 5b1a1d551c2bf9f740170b2b14e056f070e880f7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pablo=20N=C3=BA=C3=B1ez?= Date: Thu, 12 Aug 2021 13:00:27 +0200 Subject: [PATCH 3/4] Change check so it works for other elements inside the label. --- src/index.ts | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/src/index.ts b/src/index.ts index 3288118..81a4cf1 100644 --- a/src/index.ts +++ b/src/index.ts @@ -172,10 +172,14 @@ function shouldCommit(details: Element, event: Event) { const menuitem = target.closest('[role="menuitem"], [role="menuitemradio"]') if (!menuitem) return + const input = menuitem.querySelector('input') + // Ignore double event caused by inputs nested in labels - if (menuitem.tagName === 'LABEL' && target !== menuitem) return + // Known issue: This will wrongly ignore a legit click event on an already checked input, + // but inputs are not expected to be visible in the menu items. + // I've found no way to discriminate the legit event from the echo one, and we don't want to trigger the selected event twice. + if (menuitem.tagName === 'LABEL' && target === input) return - const input = menuitem.querySelector('input') // An input inside a label will be committed as a change event (we assume it's a radio input), // unless the input is already checked, so we need to commit on click (to close the popup) const onlyCommitOnChangeEvent = menuitem.tagName === 'LABEL' && input && !input.checked From d87b07282b4b3462c73de407c8418845b7a450f3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Kristj=C3=A1n=20Oddsson?= Date: Mon, 23 Aug 2021 09:16:12 +0100 Subject: [PATCH 4/4] 1.0.12 --- package-lock.json | 4 ++-- package.json | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/package-lock.json b/package-lock.json index 7f57e6d..e010eb8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@github/details-menu-element", - "version": "1.0.11", + "version": "1.0.12", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@github/details-menu-element", - "version": "1.0.10", + "version": "1.0.12", "license": "MIT", "devDependencies": { "@github/prettier-config": "0.0.4", diff --git a/package.json b/package.json index 611ba06..02334aa 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@github/details-menu-element", - "version": "1.0.11", + "version": "1.0.12", "description": "A menu opened with a
button.", "main": "dist/index.js", "module": "dist/index.js",