You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@myfaces.apache.org by hn...@apache.org on 2024/05/22 10:39:02 UTC
(myfaces-tobago) 01/02: fix(select[One/Many]List): duplicated dropdown menus
This is an automated email from the ASF dual-hosted git repository.
hnoeth pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/myfaces-tobago.git
commit 6d22d6e4f896604bbeb47a5ff6567f1cb2d8ae7f
Author: Henning Noeth <hn...@apache.org>
AuthorDate: Tue May 21 13:56:16 2024 +0200
fix(select[One/Many]List): duplicated dropdown menus
* add test
* implement disconnectedCallback: remove dropdown menu
Issue: TOBAGO-2314
---
.../2098-selectOneList/SelectOneList.test.js | 54 ++++++++++++++++++++++
.../2098-selectOneList/SelectOneList.xhtml | 32 +++++++++++++
.../src/main/ts/tobago-select-list-base.ts | 4 ++
3 files changed, 90 insertions(+)
diff --git a/tobago-example/tobago-example-demo/src/main/webapp/content/900-test/2098-selectOneList/SelectOneList.test.js b/tobago-example/tobago-example-demo/src/main/webapp/content/900-test/2098-selectOneList/SelectOneList.test.js
new file mode 100644
index 0000000000..b71f7c84be
--- /dev/null
+++ b/tobago-example/tobago-example-demo/src/main/webapp/content/900-test/2098-selectOneList/SelectOneList.test.js
@@ -0,0 +1,54 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {JasmineTestTool} from "/tobago/test/tobago-test-tool.js";
+import {elementByIdFn, querySelectorAllFn, querySelectorFn} from "/script/tobago-test.js";
+
+it("Standard: select 'Venus', select 'Earth'", function (done) {
+ const selectFieldFn = elementByIdFn("page:mainForm:selectedStandard::selectField");
+ const optionsFn = querySelectorAllFn(".tobago-options[name='page:mainForm:selectedStandard']");
+ const mercuryRowFn = querySelectorFn(".tobago-options[name='page:mainForm:selectedStandard'] tr[data-tobago-value='Mercury']");
+ const venusRowFn = querySelectorFn(".tobago-options[name='page:mainForm:selectedStandard'] tr[data-tobago-value='Venus']");
+ const earthRowFn = querySelectorFn(".tobago-options[name='page:mainForm:selectedStandard'] tr[data-tobago-value='Earth']");
+ const outputFn = querySelectorFn("#page\\:mainForm\\:output .form-control-plaintext");
+
+ const test = new JasmineTestTool(done);
+ test.setup(() => outputFn().textContent === "Mercury", null, "click", mercuryRowFn);
+
+ test.do(() => expect(optionsFn().length).toEqual(1));
+ test.do(() => expect(optionsFn()[0].classList).not.toContain("show"));
+
+ test.event("click", selectFieldFn, () => optionsFn()[0].classList.contains("show"));
+ test.do(() => expect(optionsFn().length).toEqual(1));
+ test.do(() => expect(optionsFn()[0].classList).toContain("show"));
+
+ test.event("click", venusRowFn, () => outputFn().textContent === "Venus");
+ test.do(() => expect(optionsFn().length).toEqual(1));
+ test.do(() => expect(optionsFn()[0].classList).not.toContain("show"));
+ test.do(() => expect(outputFn().textContent).toEqual("Venus"));
+
+ test.event("click", selectFieldFn, () => optionsFn()[0].classList.contains("show"));
+ test.do(() => expect(optionsFn().length).toEqual(1));
+ test.do(() => expect(optionsFn()[0].classList).toContain("show"));
+
+ test.event("click", earthRowFn, () => outputFn().textContent === "Earth");
+ test.do(() => expect(optionsFn().length).toEqual(1));
+ test.do(() => expect(optionsFn()[0].classList).not.toContain("show"));
+ test.do(() => expect(outputFn().textContent).toEqual("Earth"));
+
+ test.start();
+});
diff --git a/tobago-example/tobago-example-demo/src/main/webapp/content/900-test/2098-selectOneList/SelectOneList.xhtml b/tobago-example/tobago-example-demo/src/main/webapp/content/900-test/2098-selectOneList/SelectOneList.xhtml
new file mode 100644
index 0000000000..1abe7be3b8
--- /dev/null
+++ b/tobago-example/tobago-example-demo/src/main/webapp/content/900-test/2098-selectOneList/SelectOneList.xhtml
@@ -0,0 +1,32 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<!--
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+-->
+
+<ui:composition template="/main.xhtml"
+ xmlns="http://www.w3.org/1999/xhtml"
+ xmlns:f="jakarta.faces.core"
+ xmlns:tc="http://myfaces.apache.org/tobago/component"
+ xmlns:ui="jakarta.faces.facelets">
+
+ <tc:selectOneList id="selectedStandard" label="Standard" value="#{selectOneListController.selectedPlanet}">
+ <tc:selectItems value="#{selectOneListController.planets}"
+ var="planet" itemLabel="#{planet.name}" itemValue="#{planet}"/>
+ <f:ajax render="selectedStandard output"/>
+ </tc:selectOneList>
+ <tc:out id="output" label="Planet" value="#{selectOneListController.selectedPlanet}"/>
+</ui:composition>
diff --git a/tobago-theme/tobago-theme-standard/src/main/ts/tobago-select-list-base.ts b/tobago-theme/tobago-theme-standard/src/main/ts/tobago-select-list-base.ts
index 9727b5a823..8042f7143d 100644
--- a/tobago-theme/tobago-theme-standard/src/main/ts/tobago-select-list-base.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/ts/tobago-select-list-base.ts
@@ -122,6 +122,10 @@ export abstract class SelectListBase extends HTMLElement {
this.options.addEventListener("dblclick", () => this.hiddenSelect.dispatchEvent(new Event("dblclick")));
}
+ disconnectedCallback(): void {
+ this.dropdownMenu?.remove();
+ }
+
protected abstract globalClickEvent(event: MouseEvent): void;
/**