From 6be5ab5b26a5c99edbdd86277df182cbf13e1f29 Mon Sep 17 00:00:00 2001 From: bugsounet Date: Sun, 24 Sep 2023 11:31:39 +0200 Subject: [PATCH 1/4] AnimateCSS integration test --- .../compliments/compliments_animateCSS.js | 28 +++++++++++++ tests/electron/modules/animateCSS_spec.js | 39 +++++++++++++++++++ 2 files changed, 67 insertions(+) create mode 100644 tests/configs/modules/compliments/compliments_animateCSS.js create mode 100644 tests/electron/modules/animateCSS_spec.js diff --git a/tests/configs/modules/compliments/compliments_animateCSS.js b/tests/configs/modules/compliments/compliments_animateCSS.js new file mode 100644 index 0000000000..24e2736073 --- /dev/null +++ b/tests/configs/modules/compliments/compliments_animateCSS.js @@ -0,0 +1,28 @@ +/* MagicMirror² Test config sample for AnimateCSS integration with compliments module + * + * By bugsounet https://github.com/bugsounet + * 09/2023 + * MIT Licensed. + */ +let config = { + modules: [ + { + module: "compliments", + position: "lower_third", + animateIn: "flipInX", + animateOut: "flipOutX", + config: { + compliments: { + anytime: ["AnimateCSS Testing..."] + }, + updateInterval: 2000, + fadeSpeed: 1000 + } + } + ] +}; + +/*************** DO NOT EDIT THE LINE BELOW ***************/ +if (typeof module !== "undefined") { + module.exports = config; +} diff --git a/tests/electron/modules/animateCSS_spec.js b/tests/electron/modules/animateCSS_spec.js new file mode 100644 index 0000000000..3a1caf2298 --- /dev/null +++ b/tests/electron/modules/animateCSS_spec.js @@ -0,0 +1,39 @@ +/* AnimateCSS integration Test with compliments module + * + * By bugsounet https://github.com/bugsounet + * 09/2023 + * MIT Licensed. + */ +const helpers = require("../helpers/global-setup"); + +describe("AnimateCSS integration Test", () => { + // define config file for testing + let testConfigFile = "tests/configs/modules/compliments/compliments_animateCSS.js"; + + /** + * move similar tests in function doTest + * @param {string} [animationName] animation name of AnimateCSS to test. + */ + const doTest = async (animationName) => { + let elem = await helpers.getElement(`.compliments.animate__animated.animate__${animationName}`); + expect(await elem.isVisible()).toBe(true); + }; + + afterEach(async () => { + await helpers.stopApplication(); + }); + + describe("AnimatedIn Test", () => { + it("with flipInX animation", async () => { + await helpers.startApplication(testConfigFile); + await doTest("flipInX"); + }); + }); + + describe("AnimatedOut Test", () => { + it("with flipOutX animation", async () => { + await helpers.startApplication(testConfigFile); + await doTest("flipOutX"); + }); + }); +}); From 5b1765c06ed7b2042342d06900d12a18b3c77195 Mon Sep 17 00:00:00 2001 From: bugsounet Date: Sun, 24 Sep 2023 11:45:55 +0200 Subject: [PATCH 2/4] add changeLog --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index e59f84c60d..bfbce86b24 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -21,6 +21,7 @@ _This release is scheduled to be released on 2023-10-01._ - Apply AnimateIn rules on the first start - Added automatic client page reload when server was restarted by setting `reloadAfterServerRestart: true` in `config.js`, per default `false` (#3105) - Added eventClass option for customEvents on the default calendar +- Added AnimateCSS integration in tests suite (#3206) ### Removed From 11f39e825f5796e8407e37c4d7ce980e74226a4d Mon Sep 17 00:00:00 2001 From: bugsounet Date: Mon, 25 Sep 2023 19:33:16 +0200 Subject: [PATCH 3/4] new animateCSS spec --- ...ompliments_animateCSS_fallbackToDefault.js | 29 +++++++ ...iments_animateCSS_invertedAnimationName.js | 28 +++++++ tests/e2e/animateCSS_spec.js | 78 +++++++++++++++++++ tests/e2e/helpers/global-setup.js | 1 + tests/electron/modules/animateCSS_spec.js | 39 ---------- 5 files changed, 136 insertions(+), 39 deletions(-) create mode 100644 tests/configs/modules/compliments/compliments_animateCSS_fallbackToDefault.js create mode 100644 tests/configs/modules/compliments/compliments_animateCSS_invertedAnimationName.js create mode 100644 tests/e2e/animateCSS_spec.js delete mode 100644 tests/electron/modules/animateCSS_spec.js diff --git a/tests/configs/modules/compliments/compliments_animateCSS_fallbackToDefault.js b/tests/configs/modules/compliments/compliments_animateCSS_fallbackToDefault.js new file mode 100644 index 0000000000..89c0694466 --- /dev/null +++ b/tests/configs/modules/compliments/compliments_animateCSS_fallbackToDefault.js @@ -0,0 +1,29 @@ +/* MagicMirror² Test config sample for AnimateCSS integration with compliments module + * --> if animation name is not an AnimateCSS animation + * --> must fallback to default (no animation) + * By bugsounet https://github.com/bugsounet + * 09/2023 + * MIT Licensed. + */ +let config = { + modules: [ + { + module: "compliments", + position: "lower_third", + animateIn: "foo", + animateOut: "bar", + config: { + compliments: { + anytime: ["AnimateCSS Testing..."] + }, + updateInterval: 2000, + fadeSpeed: 1000 + } + } + ] +}; + +/*************** DO NOT EDIT THE LINE BELOW ***************/ +if (typeof module !== "undefined") { + module.exports = config; +} diff --git a/tests/configs/modules/compliments/compliments_animateCSS_invertedAnimationName.js b/tests/configs/modules/compliments/compliments_animateCSS_invertedAnimationName.js new file mode 100644 index 0000000000..16bee188ed --- /dev/null +++ b/tests/configs/modules/compliments/compliments_animateCSS_invertedAnimationName.js @@ -0,0 +1,28 @@ +/* MagicMirror² Test config sample for AnimateCSS integration with compliments module + * + * By bugsounet https://github.com/bugsounet + * 09/2023 + * MIT Licensed. + */ +let config = { + modules: [ + { + module: "compliments", + position: "lower_third", + animateIn: "flipOutX", + animateOut: "flipInX", + config: { + compliments: { + anytime: ["AnimateCSS Testing..."] + }, + updateInterval: 2000, + fadeSpeed: 1000 + } + } + ] +}; + +/*************** DO NOT EDIT THE LINE BELOW ***************/ +if (typeof module !== "undefined") { + module.exports = config; +} diff --git a/tests/e2e/animateCSS_spec.js b/tests/e2e/animateCSS_spec.js new file mode 100644 index 0000000000..3f7cac8354 --- /dev/null +++ b/tests/e2e/animateCSS_spec.js @@ -0,0 +1,78 @@ +/* AnimateCSS integration Test with compliments module + * + * By bugsounet https://github.com/bugsounet + * and helped by khassel + * 09/2023 + * MIT Licensed. + */ +const helpers = require("./helpers/global-setup.js"); + +describe("AnimateCSS integration Test", () => { + // define config file for testing + let testConfigFile = "tests/configs/modules/compliments/compliments_animateCSS.js"; + // define config file to fallback to default: wrong animation name (must return no animation) + let testConfigFileFallbackToDefault = "tests/configs/modules/compliments/compliments_animateCSS_fallbackToDefault.js"; + // define config file with an inversed name animation : in for out and vice versa (must return no animation) + let testConfigFileInvertedAnimationName = "tests/configs/modules/compliments/compliments_animateCSS_invertedAnimationName.js"; + // define config file with no animation defined + let testConfigByDefault = "tests/configs/modules/compliments/compliments_anytime.js"; + + /** + * move similar tests in function doTest + * @param {string} [animationIn] animation in name of AnimateCSS to test. + * @param {string} [animationOut] animation out name of AnimateCSS to test. + */ + const doTest = async (animationIn, animationOut) => { + await helpers.getDocument(); + let elem = await helpers.waitForElement(`.compliments`); + expect(elem).not.toBe(null); + let styles = window.getComputedStyle(elem); + + if (animationIn && animationIn !== "") { + expect(styles._values["animation-name"]).toBe(animationIn); + } else { + expect(styles._values["animation-name"]).toBe(undefined); + } + + if (animationOut && animationOut !== "") { + elem = await helpers.waitForElement(`.compliments.animate__animated.animate__${animationOut}`); + expect(elem).not.toBe(null); + styles = window.getComputedStyle(elem); + expect(styles._values["animation-name"]).toBe(animationOut); + } else { + expect(styles._values["animation-name"]).toBe(undefined); + } + }; + + afterEach(async () => { + await helpers.stopApplication(); + }); + + describe("animateIn and animateOut Test", () => { + it("with flipInX and flipOutX animation", async () => { + await helpers.startApplication(testConfigFile); + await doTest("flipInX", "flipOutX"); + }); + }); + + describe("use animateOut name for animateIn (vice versa) Test", () => { + it("without animation", async () => { + await helpers.startApplication(testConfigFileInvertedAnimationName); + await doTest(); + }); + }); + + describe("false Animation name test", () => { + it("without animation", async () => { + await helpers.startApplication(testConfigFileFallbackToDefault); + await doTest(); + }); + }); + + describe("no Animation defined test", () => { + it("without animation", async () => { + await helpers.startApplication(testConfigByDefault); + await doTest(); + }); + }); +}); diff --git a/tests/e2e/helpers/global-setup.js b/tests/e2e/helpers/global-setup.js index d5506024af..d20156e5fd 100644 --- a/tests/e2e/helpers/global-setup.js +++ b/tests/e2e/helpers/global-setup.js @@ -30,6 +30,7 @@ exports.getDocument = () => { const url = `http://${config.address || "localhost"}:${config.port || "8080"}`; jsdom.JSDOM.fromURL(url, { resources: "usable", runScripts: "dangerously" }).then((dom) => { dom.window.name = "jsdom"; + global.window = dom.window; dom.window.fetch = fetch; dom.window.onload = () => { global.document = dom.window.document; diff --git a/tests/electron/modules/animateCSS_spec.js b/tests/electron/modules/animateCSS_spec.js deleted file mode 100644 index 3a1caf2298..0000000000 --- a/tests/electron/modules/animateCSS_spec.js +++ /dev/null @@ -1,39 +0,0 @@ -/* AnimateCSS integration Test with compliments module - * - * By bugsounet https://github.com/bugsounet - * 09/2023 - * MIT Licensed. - */ -const helpers = require("../helpers/global-setup"); - -describe("AnimateCSS integration Test", () => { - // define config file for testing - let testConfigFile = "tests/configs/modules/compliments/compliments_animateCSS.js"; - - /** - * move similar tests in function doTest - * @param {string} [animationName] animation name of AnimateCSS to test. - */ - const doTest = async (animationName) => { - let elem = await helpers.getElement(`.compliments.animate__animated.animate__${animationName}`); - expect(await elem.isVisible()).toBe(true); - }; - - afterEach(async () => { - await helpers.stopApplication(); - }); - - describe("AnimatedIn Test", () => { - it("with flipInX animation", async () => { - await helpers.startApplication(testConfigFile); - await doTest("flipInX"); - }); - }); - - describe("AnimatedOut Test", () => { - it("with flipOutX animation", async () => { - await helpers.startApplication(testConfigFile); - await doTest("flipOutX"); - }); - }); -}); From 63f97dc5017d772c107e56384dba3ed3d78a92b0 Mon Sep 17 00:00:00 2001 From: bugsounet Date: Mon, 25 Sep 2023 19:36:09 +0200 Subject: [PATCH 4/4] missing comment --- .../compliments/compliments_animateCSS_invertedAnimationName.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/configs/modules/compliments/compliments_animateCSS_invertedAnimationName.js b/tests/configs/modules/compliments/compliments_animateCSS_invertedAnimationName.js index 16bee188ed..eb4af0ca1b 100644 --- a/tests/configs/modules/compliments/compliments_animateCSS_invertedAnimationName.js +++ b/tests/configs/modules/compliments/compliments_animateCSS_invertedAnimationName.js @@ -1,5 +1,5 @@ /* MagicMirror² Test config sample for AnimateCSS integration with compliments module - * + * --> inversed name animation : in for out and vice versa (must return no animation) * By bugsounet https://github.com/bugsounet * 09/2023 * MIT Licensed.