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 2022/05/25 14:24:06 UTC
[myfaces-tobago] branch master updated: test(tab): CSS customClass set on header/body
This is an automated email from the ASF dual-hosted git repository.
hnoeth pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/myfaces-tobago.git
The following commit(s) were added to refs/heads/master by this push:
new 10a1c2fbec test(tab): CSS customClass set on header/body
10a1c2fbec is described below
commit 10a1c2fbecec4b29b8ced361f9427decf9d8154d
Author: Henning Noeth <hn...@apache.org>
AuthorDate: Wed May 25 16:16:31 2022 +0200
test(tab): CSS customClass set on header/body
Issue: TOBAGO-2120
---
.../900-test/2500-tab/Tabgroup_Style.test.js | 36 ++++++++++++++++------
.../content/900-test/2500-tab/Tabgroup_Style.xhtml | 4 +++
2 files changed, 30 insertions(+), 10 deletions(-)
diff --git a/tobago-example/tobago-example-demo/src/main/webapp/content/900-test/2500-tab/Tabgroup_Style.test.js b/tobago-example/tobago-example-demo/src/main/webapp/content/900-test/2500-tab/Tabgroup_Style.test.js
index b06c964dcf..02c3c9721f 100644
--- a/tobago-example/tobago-example-demo/src/main/webapp/content/900-test/2500-tab/Tabgroup_Style.test.js
+++ b/tobago-example/tobago-example-demo/src/main/webapp/content/900-test/2500-tab/Tabgroup_Style.test.js
@@ -19,16 +19,18 @@ import {querySelectorFn} from "/script/tobago-test.js";
import {JasmineTestTool} from "/tobago/test/tobago-test-tool.js";
it("test numbers of tab-group-index", function (done) {
- let tab1Fn = querySelectorFn("#page\\:mainForm\\:tabOne");
- let tab2Fn = querySelectorFn("#page\\:mainForm\\:tabTwo");
- let tab3Fn = querySelectorFn("#page\\:mainForm\\:tabThree");
- let tab4Fn = querySelectorFn("#page\\:mainForm\\:tabFour");
- let tab5Fn = querySelectorFn("#page\\:mainForm\\:tabFive");
- let tabContent1Fn = querySelectorFn("#page\\:mainForm\\:tabOne\\:\\:content");
- let tabContent2Fn = querySelectorFn("#page\\:mainForm\\:tabTwo\\:\\:content");
- let tabContent3Fn = querySelectorFn("#page\\:mainForm\\:tabThree\\:\\:content");
- let tabContent4Fn = querySelectorFn("#page\\:mainForm\\:tabFour\\:\\:content");
- let tabContent5Fn = querySelectorFn("#page\\:mainForm\\:tabFive\\:\\:content");
+ const tab1Fn = querySelectorFn("#page\\:mainForm\\:tabOne");
+ const tab2Fn = querySelectorFn("#page\\:mainForm\\:tabTwo");
+ const tab3Fn = querySelectorFn("#page\\:mainForm\\:tabThree");
+ const tab4Fn = querySelectorFn("#page\\:mainForm\\:tabFour");
+ const tab5Fn = querySelectorFn("#page\\:mainForm\\:tabFive");
+ const tab6Fn = querySelectorFn("#page\\:mainForm\\:tabSix");
+ const tabContent1Fn = querySelectorFn("#page\\:mainForm\\:tabOne\\:\\:content");
+ const tabContent2Fn = querySelectorFn("#page\\:mainForm\\:tabTwo\\:\\:content");
+ const tabContent3Fn = querySelectorFn("#page\\:mainForm\\:tabThree\\:\\:content");
+ const tabContent4Fn = querySelectorFn("#page\\:mainForm\\:tabFour\\:\\:content");
+ const tabContent5Fn = querySelectorFn("#page\\:mainForm\\:tabFive\\:\\:content");
+ const tabContent6Fn = querySelectorFn("#page\\:mainForm\\:tabSix\\:\\:content");
let test = new JasmineTestTool(done);
test.do(() => expect(tab1Fn().index).toBe(0));
@@ -36,18 +38,32 @@ it("test numbers of tab-group-index", function (done) {
test.do(() => expect(tab3Fn()).toBe(null, "Tab three is not rendered"));
test.do(() => expect(tab4Fn().index).toBe(3));
test.do(() => expect(tab5Fn().index).toBe(4));
+ test.do(() => expect(tab6Fn().index).toBe(5));
test.do(() => expect(tabContent1Fn().dataset["index"]).toBe("0"));
test.do(() => expect(tabContent2Fn().dataset["index"]).toBe("1"));
test.do(() => expect(tabContent3Fn()).toBe(null, "Tab three content is not rendered"));
test.do(() => expect(tabContent4Fn()).toBe(null, "Tab four content is not rendered (disabled)"));
test.do(() => expect(tabContent5Fn().dataset["index"]).toBe("4"));
+ test.do(() => expect(tabContent6Fn().dataset["index"]).toBe("5"));
test.do(() => expect(tab1Fn().querySelector(".nav-link").classList.contains("active")).toBe(true));
test.do(() => expect(tab2Fn().querySelector(".nav-link").classList.contains("active")).not.toBe(true));
test.do(() => expect(tab4Fn().querySelector(".nav-link").classList.contains("active")).not.toBe(true));
test.do(() => expect(tab5Fn().querySelector(".nav-link").classList.contains("active")).not.toBe(true));
+ test.do(() => expect(tab6Fn().querySelector(".nav-link").classList.contains("active")).not.toBe(true));
test.do(() => expect(tabContent1Fn().classList.contains("active")).toBe(true));
test.do(() => expect(tabContent2Fn().classList.contains("active")).not.toBe(true));
test.do(() => expect(tabContent4Fn()).toBe(null));
test.do(() => expect(tabContent5Fn().classList.contains("active")).not.toBe("active"));
+ test.do(() => expect(tabContent6Fn().classList.contains("active")).not.toBe(true));
+ test.start();
+});
+
+it("test custom-css-class", function (done) {
+ const tab6Fn = querySelectorFn("#page\\:mainForm\\:tabSix");
+ const tabContent6Fn = querySelectorFn("#page\\:mainForm\\:tabSix\\:\\:content");
+
+ let test = new JasmineTestTool(done);
+ test.do(() => expect(tab6Fn().classList.contains("tab-six-custom")).toBe(true));
+ test.do(() => expect(tabContent6Fn().classList.contains("tab-six-custom")).toBe(true));
test.start();
});
diff --git a/tobago-example/tobago-example-demo/src/main/webapp/content/900-test/2500-tab/Tabgroup_Style.xhtml b/tobago-example/tobago-example-demo/src/main/webapp/content/900-test/2500-tab/Tabgroup_Style.xhtml
index 55359a773d..cbd233a118 100644
--- a/tobago-example/tobago-example-demo/src/main/webapp/content/900-test/2500-tab/Tabgroup_Style.xhtml
+++ b/tobago-example/tobago-example-demo/src/main/webapp/content/900-test/2500-tab/Tabgroup_Style.xhtml
@@ -38,5 +38,9 @@
<tc:tab id="tabFive" label="Five">
Fifth tab.
</tc:tab>
+ <tc:tab id="tabSix" label="Six">
+ <tc:style customClass="tab-six-custom"/>
+ Sixth tab.
+ </tc:tab>
</tc:tabGroup>
</ui:composition>