diff --git a/log/error.log b/log/error.log index de3c5bb..073dd44 100755 --- a/log/error.log +++ b/log/error.log @@ -8,3 +8,4 @@ 2018-09-22T00:58:53+02:00 ERR (3): syntax error, unexpected '$request' (T_VARIABLE) - ErrorCode: 0 File: /var/www/pwa/wordRotator/src/module/Application/src/Controller/SyncController.php Line: 108 2018-09-22T01:00:24+02:00 ERR (3): syntax error, unexpected '$request' (T_VARIABLE) - ErrorCode: 0 File: /var/www/pwa/wordRotator/src/module/Application/src/Controller/SyncController.php Line: 108 2018-09-22T01:01:25+02:00 ERR (3): +2018-09-22T12:55:44+02:00 ERR (3): diff --git a/log/log.log b/log/log.log index de3c5bb..073dd44 100755 --- a/log/log.log +++ b/log/log.log @@ -8,3 +8,4 @@ 2018-09-22T00:58:53+02:00 ERR (3): syntax error, unexpected '$request' (T_VARIABLE) - ErrorCode: 0 File: /var/www/pwa/wordRotator/src/module/Application/src/Controller/SyncController.php Line: 108 2018-09-22T01:00:24+02:00 ERR (3): syntax error, unexpected '$request' (T_VARIABLE) - ErrorCode: 0 File: /var/www/pwa/wordRotator/src/module/Application/src/Controller/SyncController.php Line: 108 2018-09-22T01:01:25+02:00 ERR (3): +2018-09-22T12:55:44+02:00 ERR (3): diff --git a/orga/credits.txt b/orga/credits.txt new file mode 100644 index 0000000..8ad1264 --- /dev/null +++ b/orga/credits.txt @@ -0,0 +1 @@ +single_coin_on_concrete https://www.freesfx.co.uk/ \ No newline at end of file diff --git a/public/img/coin.png b/public/img/coin.png index 463e129..d896d10 100644 Binary files a/public/img/coin.png and b/public/img/coin.png differ diff --git a/public/img/test.png b/public/img/test.png deleted file mode 100755 index 71bcbf5..0000000 Binary files a/public/img/test.png and /dev/null differ diff --git a/public/js/app.js b/public/js/app.js index bcb631b..32bb2db 100755 --- a/public/js/app.js +++ b/public/js/app.js @@ -1953,8 +1953,7 @@ class SiteManager { this.titleElement = document.querySelector(".top-bar-title"); const defaultTitleElem = document.createElement("span"); - while(this.titleElement.childNodes.length > 0) - { + while (this.titleElement.childNodes.length > 0) { const child = this.titleElement.firstChild; child.remove(); defaultTitleElem.appendChild(child); @@ -1964,7 +1963,6 @@ class SiteManager { element: defaultTitleElem, title: document.title }; - console.log(this.defaultTitle); let siteManager = this; window.onpopstate = function (e) { @@ -1997,11 +1995,10 @@ class SiteManager { return this.defaultActions; } - startSite(siteConstructor, paramsPromise) { - if (!(siteConstructor.prototype instanceof AbstractSite)) - { + async startSite(siteConstructor, paramsPromise) { + if (!(siteConstructor.prototype instanceof AbstractSite)) { throw { - "error": "wrong class given! Expected AbstractSite, given "+siteConstructor.name + "error": "wrong class given! Expected AbstractSite, given " + siteConstructor.name }; } @@ -2014,16 +2011,14 @@ class SiteManager { let siteContainer = new SiteContainer(site, resolver); this.siteDiv.removeAllChildren().appendChild(Helper.createLoadingSymbol()); - let manager = this; - this.siteStartingPromise = new Promise(function (resolve) { - Promise.resolve(paramsPromise).then(function (params) { - siteContainer.setStartParameters(params); - return Promise.all([site.onConstruct(params), site.inflatePromise]); - }).then(function () { - site.actionMenu = site.createActionBarMenu(manager.buildActionBarMenu()); - }).then(function () { - resolve(manager.show(siteContainer)); - }); + this.siteStartingPromise = Promise.resolve(paramsPromise).then(async (params) => { + siteContainer.setStartParameters(params); + await Promise.all([site.onConstruct(params), site.inflatePromise]); + + site.actionMenu = site.createActionBarMenu(this.buildActionBarMenu()); + return this.show(siteContainer); + }).catch((e) => { + console.error("site start error:", e); }); return finishPromise; @@ -4610,8 +4605,6 @@ class ScaleHelper { } async _getNewFontSize(scale, fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight, setFontSize) { - - margin = Helper.nonNull(margin, 10); ignoreHeight = Helper.nonNull(ignoreHeight, false); ignoreWidth = Helper.nonNull(ignoreWidth, false); @@ -4624,8 +4617,6 @@ class ScaleHelper { container.classList.add("no-transition"); } - // debugger; - let beforeFontSize = fontElement.style.fontSize; let currentFontSize = 1; let diff = 0; @@ -4652,8 +4643,6 @@ class ScaleHelper { diff = newDiff; } while ((widthDiff > (1 - scale) * containerWidth || ignoreWidth) && (heightDiff > (1 - scale) * containerHeight || ignoreHeight)); - - console.log(setFontSize, currentFontSize, beforeFontSize, fontElement.style.fontSize, fontElement); currentFontSize -= margin; fontElement.style.fontSize = ((setFontSize) ? currentFontSize + "px" : beforeFontSize); @@ -5614,8 +5603,6 @@ class EndSite extends WordRotatorBaseSite{ class LevelSite extends WordRotatorBaseSite { constructor(siteManager) { super(siteManager, "html/application/level.html"); - this.levelScaler = () => { - }; } createActionBarMenu(menu) { @@ -5633,12 +5620,27 @@ class LevelSite extends WordRotatorBaseSite { onConstruct(args) { this.levelCounter = Helper.nonNull(localStorage.getItem("levelCounter"), 1); + this.levelScaler = () => { + }; + this.wonParams = { + aborted: false, + coinCounterTimer: null, + audio: new Audio() + }; + this.wonParams.audioPromise = Promise.race([new Promise(resolve => { + this.wonParams.audio.addEventListener('loadeddata', resolve); + }), + new Promise(resolve => { + this.wonParams.audio.addEventListener('error', resolve); + }) + ]); + this.wonParams.audio.src = Helper.basePath("sound/single_coin_fall_on_concrete_.mp3"); + return super.onConstruct(args); } async onFirstStart() { super.onFirstStart(); - let leafSegmentTemplate = this.findBy("#segment-leaf-template"); let parentSegmentTemplate = this.findBy("#segment-parent-template"); let rowSegmentTemplate = this.findBy("#segment-row-template"); @@ -5694,7 +5696,7 @@ class LevelSite extends WordRotatorBaseSite { let currentLevelInfo = localStorage.getItem("currentLevel"); if (currentLevelInfo !== null) { currentLevelInfo = JSON.parse(currentLevelInfo); - console.log("LevelID: ", currentLevelInfo["id"]); + // console.log("LevelID: ", currentLevelInfo["id"]); const db = WordRotatorDb.getInstance(); const levelJson = await db.loadLevel(currentLevelInfo["id"]); @@ -5765,6 +5767,9 @@ class LevelSite extends WordRotatorBaseSite { this.coinAction.setTitle(Helper.nonNull(localStorage.getItem("coins"), "0")); this.coinAction.redraw(); + + this.wonParams.aborted = true; + clearTimeout(this.wonParams.coinCounterTimer); } catch (e) { console.error(e); @@ -5808,33 +5813,36 @@ class LevelSite extends WordRotatorBaseSite { let coinsBefore = parseInt(Helper.nonNull(localStorage.getItem("coins"), "0")); localStorage.setItem("coins", coinsBefore + parseInt(coinsPerLevel)); - let audio = new Audio(); let coinPromise = Promise.all([new Promise((r) => { - setTimeout(r, 500); - }), - new Promise(r => { - audio.addEventListener('loadeddata', r); - }) - ]); - audio.src = Helper.basePath("sound/single_coin_fall_on_concrete_.mp3"); + setTimeout(() => { + r(continueButton.fadeIn()); + }, 500); + }), this.wonParams.audioPromise]); + this.wonParams.aborted = false; + + let audio = this.wonParams.audio; for (let i = 0; i < coinsPerLevel; i++) { let coinElem = Helper.cloneNode(this.coinTemplate); this.coinContainer.appendChild(coinElem); coinPromise = coinPromise.then(() => { return new Promise(r => { let timeout = 350; - coinElem.fadeIn(timeout / 1000); - if (audio !== null) { - audio.pause(); - audio.currentTime = 0; - audio.play(); - } - setTimeout(() => { - this.coinAction.setTitle(coinsBefore++); - this.coinAction.redraw(); - }, timeout / 2); + if (!this.wonParams.aborted) { + coinElem.fadeIn(timeout / 1000); + if (audio !== null) { + audio.pause(); + audio.currentTime = 0; + audio.play(); + } + + this.wonParams.coinCounterTimer = setTimeout(() => { + this.coinAction.setTitle(coinsBefore++); + this.coinAction.redraw(); + }, timeout / 2); + } + //Always do the next promise for garbage collection setTimeout(r, timeout); }) }); @@ -5844,9 +5852,9 @@ class LevelSite extends WordRotatorBaseSite { this.continueButtonScaler(); this.levelScaler(); - coinPromise.then(() => { - continueButton.fadeIn(); - }); + // coinPromise.then(() => { + // continueButton.fadeIn(); + // }); await savePromise; } catch (e) { @@ -5884,6 +5892,20 @@ class LevelSite extends WordRotatorBaseSite { } } +class MenuSite extends WordRotatorBaseSite{ + constructor(siteManager) { + super(siteManager, "html/application/menu.html"); + } + + + onFirstStart() { + super.onFirstStart(); + this.findBy("#play-button").addEventListener("click", () => { + this.startSite(LevelSite); + }); + } +} + class SynchronizeSite extends WordRotatorBaseSite { constructor(siteManager) { @@ -5898,7 +5920,8 @@ class SynchronizeSite extends WordRotatorBaseSite { onFirstStart() { super.onFirstStart(); - this.startSite(LevelSite); + this.startSite(MenuSite); + this.finish(); } async loadLevels() { diff --git a/src/js/lib/pwa-assets.js b/src/js/lib/pwa-assets.js index c29cf42..ce52bd4 100755 --- a/src/js/lib/pwa-assets.js +++ b/src/js/lib/pwa-assets.js @@ -41,8 +41,6 @@ class ScaleHelper { } async _getNewFontSize(scale, fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight, setFontSize) { - - margin = Helper.nonNull(margin, 10); ignoreHeight = Helper.nonNull(ignoreHeight, false); ignoreWidth = Helper.nonNull(ignoreWidth, false); @@ -55,8 +53,6 @@ class ScaleHelper { container.classList.add("no-transition"); } - // debugger; - let beforeFontSize = fontElement.style.fontSize; let currentFontSize = 1; let diff = 0; @@ -83,8 +79,6 @@ class ScaleHelper { diff = newDiff; } while ((widthDiff > (1 - scale) * containerWidth || ignoreWidth) && (heightDiff > (1 - scale) * containerHeight || ignoreHeight)); - - console.log(setFontSize, currentFontSize, beforeFontSize, fontElement.style.fontSize, fontElement); currentFontSize -= margin; fontElement.style.fontSize = ((setFontSize) ? currentFontSize + "px" : beforeFontSize); diff --git a/src/js/lib/pwa-lib.js b/src/js/lib/pwa-lib.js index af9b9fa..f6bec98 100755 --- a/src/js/lib/pwa-lib.js +++ b/src/js/lib/pwa-lib.js @@ -1953,8 +1953,7 @@ class SiteManager { this.titleElement = document.querySelector(".top-bar-title"); const defaultTitleElem = document.createElement("span"); - while(this.titleElement.childNodes.length > 0) - { + while (this.titleElement.childNodes.length > 0) { const child = this.titleElement.firstChild; child.remove(); defaultTitleElem.appendChild(child); @@ -1964,7 +1963,6 @@ class SiteManager { element: defaultTitleElem, title: document.title }; - console.log(this.defaultTitle); let siteManager = this; window.onpopstate = function (e) { @@ -1997,11 +1995,10 @@ class SiteManager { return this.defaultActions; } - startSite(siteConstructor, paramsPromise) { - if (!(siteConstructor.prototype instanceof AbstractSite)) - { + async startSite(siteConstructor, paramsPromise) { + if (!(siteConstructor.prototype instanceof AbstractSite)) { throw { - "error": "wrong class given! Expected AbstractSite, given "+siteConstructor.name + "error": "wrong class given! Expected AbstractSite, given " + siteConstructor.name }; } @@ -2014,16 +2011,14 @@ class SiteManager { let siteContainer = new SiteContainer(site, resolver); this.siteDiv.removeAllChildren().appendChild(Helper.createLoadingSymbol()); - let manager = this; - this.siteStartingPromise = new Promise(function (resolve) { - Promise.resolve(paramsPromise).then(function (params) { - siteContainer.setStartParameters(params); - return Promise.all([site.onConstruct(params), site.inflatePromise]); - }).then(function () { - site.actionMenu = site.createActionBarMenu(manager.buildActionBarMenu()); - }).then(function () { - resolve(manager.show(siteContainer)); - }); + this.siteStartingPromise = Promise.resolve(paramsPromise).then(async (params) => { + siteContainer.setStartParameters(params); + await Promise.all([site.onConstruct(params), site.inflatePromise]); + + site.actionMenu = site.createActionBarMenu(this.buildActionBarMenu()); + return this.show(siteContainer); + }).catch((e) => { + console.error("site start error:", e); }); return finishPromise; diff --git a/src/module/Application/pwa/html/application/menu.html b/src/module/Application/pwa/html/application/menu.html new file mode 100644 index 0000000..aad7b61 --- /dev/null +++ b/src/module/Application/pwa/html/application/menu.html @@ -0,0 +1,77 @@ +
+ WordRotator +
+
+
+
+
+
W
+
+
+
O
+
+
+
+
R
+
+
+
 
+
+
+
+
+
+
+
R
+
+
+
D
+
+
+
+
 
+
+
+
 
+
+
+
+
+
+
+
+
O
+
+
+
 
+
+
+
+
T
+
+
+
A
+
+
+
+
+
+
+
 
+
+
+
R
+
+
+
+
T
+
+
+
O
+
+
+
+
+
+ +
\ No newline at end of file diff --git a/src/module/Application/pwa/js/site/LevelSite.js b/src/module/Application/pwa/js/site/LevelSite.js index 5d50f4a..e9eb157 100755 --- a/src/module/Application/pwa/js/site/LevelSite.js +++ b/src/module/Application/pwa/js/site/LevelSite.js @@ -12,8 +12,6 @@ import {WordRotatorBaseSite} from "./WordRotatorBaseSite"; export class LevelSite extends WordRotatorBaseSite { constructor(siteManager) { super(siteManager, "html/application/level.html"); - this.levelScaler = () => { - }; } createActionBarMenu(menu) { @@ -31,12 +29,27 @@ export class LevelSite extends WordRotatorBaseSite { onConstruct(args) { this.levelCounter = Helper.nonNull(localStorage.getItem("levelCounter"), 1); + this.levelScaler = () => { + }; + this.wonParams = { + aborted: false, + coinCounterTimer: null, + audio: new Audio() + }; + this.wonParams.audioPromise = Promise.race([new Promise(resolve => { + this.wonParams.audio.addEventListener('loadeddata', resolve); + }), + new Promise(resolve => { + this.wonParams.audio.addEventListener('error', resolve); + }) + ]); + this.wonParams.audio.src = Helper.basePath("sound/single_coin_fall_on_concrete_.mp3"); + return super.onConstruct(args); } async onFirstStart() { super.onFirstStart(); - let leafSegmentTemplate = this.findBy("#segment-leaf-template"); let parentSegmentTemplate = this.findBy("#segment-parent-template"); let rowSegmentTemplate = this.findBy("#segment-row-template"); @@ -92,7 +105,7 @@ export class LevelSite extends WordRotatorBaseSite { let currentLevelInfo = localStorage.getItem("currentLevel"); if (currentLevelInfo !== null) { currentLevelInfo = JSON.parse(currentLevelInfo); - console.log("LevelID: ", currentLevelInfo["id"]); + // console.log("LevelID: ", currentLevelInfo["id"]); const db = WordRotatorDb.getInstance(); const levelJson = await db.loadLevel(currentLevelInfo["id"]); @@ -163,6 +176,9 @@ export class LevelSite extends WordRotatorBaseSite { this.coinAction.setTitle(Helper.nonNull(localStorage.getItem("coins"), "0")); this.coinAction.redraw(); + + this.wonParams.aborted = true; + clearTimeout(this.wonParams.coinCounterTimer); } catch (e) { console.error(e); @@ -206,33 +222,36 @@ export class LevelSite extends WordRotatorBaseSite { let coinsBefore = parseInt(Helper.nonNull(localStorage.getItem("coins"), "0")); localStorage.setItem("coins", coinsBefore + parseInt(coinsPerLevel)); - let audio = new Audio(); let coinPromise = Promise.all([new Promise((r) => { - setTimeout(r, 500) - }), - new Promise(r => { - audio.addEventListener('loadeddata', r); - }) - ]); - audio.src = Helper.basePath("sound/single_coin_fall_on_concrete_.mp3"); + setTimeout(() => { + r(continueButton.fadeIn()); + }, 500) + }), this.wonParams.audioPromise]); + this.wonParams.aborted = false; + + let audio = this.wonParams.audio; for (let i = 0; i < coinsPerLevel; i++) { let coinElem = Helper.cloneNode(this.coinTemplate); this.coinContainer.appendChild(coinElem); coinPromise = coinPromise.then(() => { return new Promise(r => { let timeout = 350; - coinElem.fadeIn(timeout / 1000); - if (audio !== null) { - audio.pause(); - audio.currentTime = 0; - audio.play(); - } - setTimeout(() => { - this.coinAction.setTitle(coinsBefore++); - this.coinAction.redraw(); - }, timeout / 2); + if (!this.wonParams.aborted) { + coinElem.fadeIn(timeout / 1000); + if (audio !== null) { + audio.pause(); + audio.currentTime = 0; + audio.play(); + } + + this.wonParams.coinCounterTimer = setTimeout(() => { + this.coinAction.setTitle(coinsBefore++); + this.coinAction.redraw(); + }, timeout / 2); + } + //Always do the next promise for garbage collection setTimeout(r, timeout); }) }); @@ -242,9 +261,9 @@ export class LevelSite extends WordRotatorBaseSite { this.continueButtonScaler(); this.levelScaler(); - coinPromise.then(() => { - continueButton.fadeIn(); - }); + // coinPromise.then(() => { + // continueButton.fadeIn(); + // }); await savePromise; } catch (e) { diff --git a/src/module/Application/pwa/js/site/MenuSite.js b/src/module/Application/pwa/js/site/MenuSite.js new file mode 100644 index 0000000..0b04e26 --- /dev/null +++ b/src/module/Application/pwa/js/site/MenuSite.js @@ -0,0 +1,15 @@ +import {WordRotatorBaseSite} from "./WordRotatorBaseSite"; +import {LevelSite} from "./LevelSite"; + +export class MenuSite extends WordRotatorBaseSite{ + constructor(siteManager) { + super(siteManager, "html/application/menu.html"); + } + + onFirstStart() { + super.onFirstStart(); + this.findBy("#play-button").addEventListener("click", () => { + this.startSite(LevelSite); + }) + } +} \ No newline at end of file diff --git a/src/module/Application/pwa/js/site/SynchronizeSite.js b/src/module/Application/pwa/js/site/SynchronizeSite.js index 35f8c30..e0118c7 100755 --- a/src/module/Application/pwa/js/site/SynchronizeSite.js +++ b/src/module/Application/pwa/js/site/SynchronizeSite.js @@ -3,6 +3,7 @@ import {DataManager} from "../../../../../js/lib/pwa-core"; import {WordRotatorDb} from "../WordRotatorDb"; import {LevelSite} from "./LevelSite"; import {WordRotatorBaseSite} from "./WordRotatorBaseSite"; +import {MenuSite} from "./MenuSite"; export class SynchronizeSite extends WordRotatorBaseSite { @@ -18,7 +19,8 @@ export class SynchronizeSite extends WordRotatorBaseSite { onFirstStart() { super.onFirstStart(); - this.startSite(LevelSite); + this.startSite(MenuSite); + this.finish(); } async loadLevels() { diff --git a/test/betaplay.testcafe.js b/test/betaplay.testcafe.js index b4502e8..1c891b2 100644 --- a/test/betaplay.testcafe.js +++ b/test/betaplay.testcafe.js @@ -1,4 +1,6 @@ import { Selector } from 'testcafe'; +import {mainTest} from "./test"; + fixture `betaPlay` .page `http://beta.wordrotator.silas.link` @@ -8,274 +10,277 @@ fixture `betaPlay` }); test('Play', async t => { - const SEGMENT = { - ONE: 0, - TWO: 1, - THREE: 2, - FOUR: 3, - FIVE: 4, - SIX : 5, - SEVEN: 6, - EIGHT : 7, - NINE: 8, - TEN: 9, - ELEVEN: 10, - TWELVE: 11, - THIRTEEN: 12, - FOURTEEN: 13, - FIFTEEN: 14, - SIXTEEN: 15, - SEVENTEEN: 16, - EIGHTEEN:17, - NINETEEN: 18, - TWENTY:19, - TWENTYONE:20 - }; + await t.wait(20000); + await mainTest(t); - await t - //first Level - .expect(Selector('.segment.segment-parent.rotate-90').nth(0).getStyleProperty('transform')).eql("matrix(0, 1, -1, 0, 0, 0)") - .expect(Selector('.segment.segment-parent.rotate-90').nth(1).getStyleProperty('transform')).eql("matrix(0, 1, -1, 0, 0, 0)") - .expect(Selector('.segment.segment-parent.rotate-270').getStyleProperty('transform')).eql("matrix(0, -1, 1, 0, 0, 0)") - .expect(Selector('#won-text').getStyleProperty('visibility')).eql("hidden") - .expect(Selector('#continue-button').getStyleProperty('visibility')).eql("hidden") - .expect(Selector('#level-number').textContent).eql("1") - .click(Selector('.segment-parent').nth(SEGMENT.THREE)) - .expect(Selector('.segment.segment-parent.rotate-360').getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .click(Selector('.segment-parent').nth(SEGMENT.ONE)) - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .click(Selector('.segment-parent').nth(SEGMENT.ONE)) - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .click(Selector('.segment-parent').nth(SEGMENT.ONE)) - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .expect(Selector('.segment.segment-parent.rotate-360').nth(1).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .expect(Selector('#won-text').visible).eql(true) - .expect(Selector('#continue-button').visible).eql(true) - .click(Selector('#continue-button')) - - //TWOLevel - .expect(Selector('.segment.segment-parent.rotate-270').nth(0).textContent).eql("BOAL") - .expect(Selector('.segment.segment-parent.rotate-180').textContent).eql("DEAR") - .expect(Selector('.segment.segment-parent.rotate-360').textContent).eql("NSMR") - .expect(Selector('.segment.segment-parent.rotate-270').nth(1).textContent).eql("EEUF") - .expect(Selector('.segment.segment-parent.rotate-270').nth(0).getStyleProperty('transform')).eql("matrix(0, -1, 1, 0, 0, 0)") - .expect(Selector('.segment.segment-parent.rotate-180').getStyleProperty('transform')).eql("matrix(-1, 0, 0, -1, 0, 0)") - .expect(Selector('.segment.segment-parent.rotate-360').getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .expect(Selector('.segment.segment-parent.rotate-270').nth(1).getStyleProperty('transform')).eql("matrix(0, -1, 1, 0, 0, 0)") - .expect(Selector('#continue-button').getStyleProperty('visibility')).eql("hidden") - .expect(Selector('#level-number').textContent).eql("2") - .expect(Selector('#won-text').getStyleProperty('visibility')).eql("hidden") - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .click(Selector('.segment-parent').nth(SEGMENT.ONE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .expect(Selector('.segment-parent').nth(SEGMENT.TWO).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .expect(Selector('.segment-parent').nth(SEGMENT.TWO).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .expect(Selector('#won-text').visible).eql(true) - .expect(Selector('#continue-button').visible).eql(true) - .click(Selector('#continue-button')) - - //THREE Level - .expect(Selector('.segment-parent').nth(SEGMENT.ONE).textContent).eql("ZEHO") - .expect(Selector('.segment-parent').nth(SEGMENT.TWO).textContent).eql("ITCH") - .expect(Selector('.segment-parent').nth(SEGMENT.THREE).textContent).eql("STSA") - .expect(Selector('.segment-parent').nth(SEGMENT.FOUR).textContent).eql("RAIS") - .expect(Selector('.segment-parent').nth(SEGMENT.FIVE).textContent).eql("FEON") - .click(Selector('.segment-parent').nth(SEGMENT.ONE)) - .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) - .click(Selector('.segment-parent').nth(SEGMENT.THREE)) - .click(Selector('.segment-parent').nth(SEGMENT.ONE)) - .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) - .click(Selector('.segment-parent').nth(SEGMENT.ONE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) - .click(Selector('#continue-button')) - - //4. Level - .expect(Selector('.segment-parent').nth(SEGMENT.ONE).textContent).eql("FERÜINCKPHREYSSI") - .expect(Selector('.segment-parent').nth(SEGMENT.TWO).textContent).eql("FERÜ") - .expect(Selector('.segment-parent').nth(SEGMENT.THREE).textContent).eql("INCK") - .expect(Selector('.segment-parent').nth(SEGMENT.FOUR).textContent).eql("PHRE") - .expect(Selector('.segment-parent').nth(SEGMENT.FIVE).textContent).eql("YSSI") - .expect(Selector('.segment-parent').nth(SEGMENT.SIX).textContent).eql("BEHE") - .expect(Selector('.segment-parent').nth(SEGMENT.SEVEN).textContent).eql("RARZ") - .expect(Selector('.segment-parent').nth(SEGMENT.EIGHT).textContent).eql("GUFA") - .expect(Selector('.segment-parent').nth(SEGMENT.NINE).textContent).eql("SSLL") - .expect(Selector('.segment-parent').nth(SEGMENT.TEN).textContent).eql("IKDEERNZTULANGND") - .expect(Selector('.segment-parent').nth(SEGMENT.ELEVEN).textContent).eql("IKDE") - .expect(Selector('.segment-parent').nth(SEGMENT.TWELVE).textContent).eql("ERNZ") - .expect(Selector('.segment-parent').nth(SEGMENT.THIRTEEN).textContent).eql("TULA") - .expect(Selector('.segment-parent').nth(SEGMENT.FOURTEEN).textContent).eql("NGND") - .drag(Selector('.segment-parent').nth(SEGMENT.TEN), 128, 4, { - offsetX: 54, - offsetY: 17 - }) - .drag(Selector('.segment-parent').nth(SEGMENT.ONE), 128, 3, { - offsetX: 54, - offsetY: 17 - }) - .drag(Selector('.segment-parent').nth(SEGMENT.TEN).find('div').withText('I'), 128, 4, { - offsetX: 27, - offsetY: 41 - }) - .drag(Selector('.segment-parent').nth(SEGMENT.ONE).find('div').withText('S'), 10, 144, { - offsetX: 64, - offsetY: 32 - }) - .drag(Selector('.segment-parent').nth(SEGMENT.TEN), 128, 4, { - offsetX: 27, - offsetY: 41 - }) - .click(Selector('.segment-parent').nth(SEGMENT.NINE)) - .click(Selector('.segment-parent').nth(SEGMENT.EIGHT)) - .click(Selector('.segment-parent').nth(SEGMENT.NINE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.ELEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.ELEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.ELEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) - .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) - .click(Selector('.segment-parent').nth(SEGMENT.SIX)) - .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) - .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.SIX)) - .expect(Selector('#continue-button').visible).eql(true) - .expect(Selector('#won-text').visible).eql(true) - .click(Selector('#continue-button')) - - //5. Level - .expect(Selector('#level-number').textContent).eql("5") - .expect(Selector('.segment-parent').nth(SEGMENT.ONE).textContent).eql("BEANTOBEALBALEUM") - .expect(Selector('.segment-parent').nth(SEGMENT.SIX).textContent).eql("NUTUNGNGRGHAIEUS") - .expect(Selector('.segment-parent').nth(SEGMENT.ONE).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .expect(Selector('.segment-parent').nth(SEGMENT.SIX).getStyleProperty('transform')).eql("matrix(0, 1, -1, 0, 0, 0)") - - .click(Selector('.segment-parent').nth(SEGMENT.THREE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .drag(Selector('.segment-parent').nth(SEGMENT.SIX).find('div').withText('U'), 3, 159, { - offsetX: 69, - offsetY: 150 - }) - .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.THREE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) - .drag(Selector('.segment-parent').nth(SEGMENT.SIX), 3, 123, { - offsetX: 86, - offsetY: 133 - }) - .click(Selector('.segment-parent').nth(SEGMENT.THREE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) - .drag(Selector('.segment-parent').nth(SEGMENT.SIX), 10, 123, { - offsetX: 60, - offsetY: 137 - }) - .expect(Selector('#won-text').visible).eql(true) - .expect(Selector('#continue-button').visible).eql(true) - .click(Selector('#continue-button')) - - - //Level 6 - .expect(Selector('#level-number').textContent).eql("6") - .expect(Selector('.segment-parent').nth(SEGMENT.ONE).textContent).eql("FEGEHLISARBEBERE") - .expect(Selector('.segment-parent').nth(SEGMENT.ONE).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .expect(Selector('.segment-parent').nth(SEGMENT.TEN).getStyleProperty('transform')).eql("matrix(-1, 0, 0, -1, 0, 0)") - .expect(Selector('.segment-parent').nth(SEGMENT.TEN).textContent).eql("ITITSPSCIKARAROT") - - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.NINE)) - .drag(Selector('.segment-parent').nth(SEGMENT.TEN).find('div').withText('A'), 106, -4, { - offsetX: 33, - offsetY: 18 - }) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.SIX)) - .click(Selector('.segment-parent').nth(SEGMENT.TWENTY)) - .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) - .click(Selector('.segment-parent').nth(SEGMENT.NINE)) - .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.TWENTYONE)) - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .click(Selector('.segment-parent').nth(SEGMENT.EIGHT)) - .click(Selector('.segment-parent').nth(SEGMENT.ELEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.NINE)) - .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.FOURTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.SIXTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) - .click(Selector('.segment-parent').nth(SEGMENT.NINETEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.TWENTYONE)) - .click(Selector('.segment-parent').nth(SEGMENT.TWENTY)) - .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.TWENTY)) - .click(Selector('.segment-parent').nth(SEGMENT.SEVENTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.SIXTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.FOURTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.NINETEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.TWENTYONE)) - .drag(Selector('.segment-parent').nth(SEGMENT.TEN).find('div').withText('P'), 169, -3, { - offsetX: 22, - offsetY: 16 - }) - .expect(Selector('div').withText('P').nth(11).find('.segment.segment-parent.layer-2.rotate-360').getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .expect(Selector('#continue-button').visible).eql(true) - .expect(Selector('#won-text').visible).eql(true) - .click(Selector('#continue-button')) - - - //Level 7 - .expect(Selector('.segment-parent').nth(SEGMENT.SIX).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .expect(Selector('.segment-row > .child-container').childElementCount).eql(3) - - .drag(Selector('.segment-parent').nth(SEGMENT.ONE), 4, 177, { - offsetX: 50, - offsetY: 73 - }) - - .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .drag(Selector('.segment-parent').nth(SEGMENT.ELEVEN), 14, 195, { - offsetX: 55, - offsetY: 57 - }) - .drag(Selector('.segment-parent').nth(SEGMENT.ONE), 4, 177, { - offsetX: 50, - offsetY: 73 - }) - .click(Selector('.segment-parent').nth(SEGMENT.THREE)) - .click(Selector('.segment-parent').nth(SEGMENT.EIGHT)) - .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.THREE)) - .click(Selector('.segment-parent').nth(SEGMENT.EIGHT)) - .click(Selector('.segment-parent').nth(SEGMENT.NINE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .drag(Selector('.segment-parent').nth(SEGMENT.ELEVEN), 14, 195, { - offsetX: 55, - offsetY: 57 - }) - .drag(Selector('.segment-parent').nth(SEGMENT.ONE), 4, 177, { - offsetX: 50, - offsetY: 73 - }) - .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) - - .expect(Selector('#won-text').visible).eql(true) - .expect(Selector('#continue-button').visible).eql(true) - .click(Selector('#continue-button')) - .expect(Selector('#site-content').childElementCount).eql(1); + // const SEGMENT = { + // ONE: 0, + // TWO: 1, + // THREE: 2, + // FOUR: 3, + // FIVE: 4, + // SIX : 5, + // SEVEN: 6, + // EIGHT : 7, + // NINE: 8, + // TEN: 9, + // ELEVEN: 10, + // TWELVE: 11, + // THIRTEEN: 12, + // FOURTEEN: 13, + // FIFTEEN: 14, + // SIXTEEN: 15, + // SEVENTEEN: 16, + // EIGHTEEN:17, + // NINETEEN: 18, + // TWENTY:19, + // TWENTYONE:20 + // }; + // + // await t + // //first Level + // .expect(Selector('.segment.segment-parent.rotate-90').nth(0).getStyleProperty('transform')).eql("matrix(0, 1, -1, 0, 0, 0)") + // .expect(Selector('.segment.segment-parent.rotate-90').nth(1).getStyleProperty('transform')).eql("matrix(0, 1, -1, 0, 0, 0)") + // .expect(Selector('.segment.segment-parent.rotate-270').getStyleProperty('transform')).eql("matrix(0, -1, 1, 0, 0, 0)") + // .expect(Selector('#won-text').getStyleProperty('visibility')).eql("hidden") + // .expect(Selector('#continue-button').getStyleProperty('visibility')).eql("hidden") + // .expect(Selector('#level-number').textContent).eql("1") + // .click(Selector('.segment-parent').nth(SEGMENT.THREE)) + // .expect(Selector('.segment.segment-parent.rotate-360').getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + // .click(Selector('.segment-parent').nth(SEGMENT.ONE)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + // .click(Selector('.segment-parent').nth(SEGMENT.ONE)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + // .click(Selector('.segment-parent').nth(SEGMENT.ONE)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + // .expect(Selector('.segment.segment-parent.rotate-360').nth(1).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + // .expect(Selector('#won-text').visible).eql(true) + // .expect(Selector('#continue-button').visible).eql(true) + // .click(Selector('#continue-button')) + // + // //TWOLevel + // .expect(Selector('.segment.segment-parent.rotate-270').nth(0).textContent).eql("BOAL") + // .expect(Selector('.segment.segment-parent.rotate-180').textContent).eql("DEAR") + // .expect(Selector('.segment.segment-parent.rotate-360').textContent).eql("NSMR") + // .expect(Selector('.segment.segment-parent.rotate-270').nth(1).textContent).eql("EEUF") + // .expect(Selector('.segment.segment-parent.rotate-270').nth(0).getStyleProperty('transform')).eql("matrix(0, -1, 1, 0, 0, 0)") + // .expect(Selector('.segment.segment-parent.rotate-180').getStyleProperty('transform')).eql("matrix(-1, 0, 0, -1, 0, 0)") + // .expect(Selector('.segment.segment-parent.rotate-360').getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + // .expect(Selector('.segment.segment-parent.rotate-270').nth(1).getStyleProperty('transform')).eql("matrix(0, -1, 1, 0, 0, 0)") + // .expect(Selector('#continue-button').getStyleProperty('visibility')).eql("hidden") + // .expect(Selector('#level-number').textContent).eql("2") + // .expect(Selector('#won-text').getStyleProperty('visibility')).eql("hidden") + // .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + // .click(Selector('.segment-parent').nth(SEGMENT.ONE)) + // .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + // .expect(Selector('.segment-parent').nth(SEGMENT.TWO).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + // .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + // .expect(Selector('.segment-parent').nth(SEGMENT.TWO).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + // .expect(Selector('#won-text').visible).eql(true) + // .expect(Selector('#continue-button').visible).eql(true) + // .click(Selector('#continue-button')) + // + // //THREE Level + // .expect(Selector('.segment-parent').nth(SEGMENT.ONE).textContent).eql("ZEHO") + // .expect(Selector('.segment-parent').nth(SEGMENT.TWO).textContent).eql("ITCH") + // .expect(Selector('.segment-parent').nth(SEGMENT.THREE).textContent).eql("STSA") + // .expect(Selector('.segment-parent').nth(SEGMENT.FOUR).textContent).eql("RAIS") + // .expect(Selector('.segment-parent').nth(SEGMENT.FIVE).textContent).eql("FEON") + // .click(Selector('.segment-parent').nth(SEGMENT.ONE)) + // .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) + // .click(Selector('.segment-parent').nth(SEGMENT.THREE)) + // .click(Selector('.segment-parent').nth(SEGMENT.ONE)) + // .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) + // .click(Selector('.segment-parent').nth(SEGMENT.ONE)) + // .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + // .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) + // .click(Selector('#continue-button')) + // + // //4. Level + // .expect(Selector('.segment-parent').nth(SEGMENT.ONE).textContent).eql("FERÜINCKPHREYSSI") + // .expect(Selector('.segment-parent').nth(SEGMENT.TWO).textContent).eql("FERÜ") + // .expect(Selector('.segment-parent').nth(SEGMENT.THREE).textContent).eql("INCK") + // .expect(Selector('.segment-parent').nth(SEGMENT.FOUR).textContent).eql("PHRE") + // .expect(Selector('.segment-parent').nth(SEGMENT.FIVE).textContent).eql("YSSI") + // .expect(Selector('.segment-parent').nth(SEGMENT.SIX).textContent).eql("BEHE") + // .expect(Selector('.segment-parent').nth(SEGMENT.SEVEN).textContent).eql("RARZ") + // .expect(Selector('.segment-parent').nth(SEGMENT.EIGHT).textContent).eql("GUFA") + // .expect(Selector('.segment-parent').nth(SEGMENT.NINE).textContent).eql("SSLL") + // .expect(Selector('.segment-parent').nth(SEGMENT.TEN).textContent).eql("IKDEERNZTULANGND") + // .expect(Selector('.segment-parent').nth(SEGMENT.ELEVEN).textContent).eql("IKDE") + // .expect(Selector('.segment-parent').nth(SEGMENT.TWELVE).textContent).eql("ERNZ") + // .expect(Selector('.segment-parent').nth(SEGMENT.THIRTEEN).textContent).eql("TULA") + // .expect(Selector('.segment-parent').nth(SEGMENT.FOURTEEN).textContent).eql("NGND") + // .drag(Selector('.segment-parent').nth(SEGMENT.TEN), 128, 4, { + // offsetX: 54, + // offsetY: 17 + // }) + // .drag(Selector('.segment-parent').nth(SEGMENT.ONE), 128, 3, { + // offsetX: 54, + // offsetY: 17 + // }) + // .drag(Selector('.segment-parent').nth(SEGMENT.TEN).find('div').withText('I'), 128, 4, { + // offsetX: 27, + // offsetY: 41 + // }) + // .drag(Selector('.segment-parent').nth(SEGMENT.ONE).find('div').withText('S'), 10, 144, { + // offsetX: 64, + // offsetY: 32 + // }) + // .drag(Selector('.segment-parent').nth(SEGMENT.TEN), 128, 4, { + // offsetX: 27, + // offsetY: 41 + // }) + // .click(Selector('.segment-parent').nth(SEGMENT.NINE)) + // .click(Selector('.segment-parent').nth(SEGMENT.EIGHT)) + // .click(Selector('.segment-parent').nth(SEGMENT.NINE)) + // .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + // .click(Selector('.segment-parent').nth(SEGMENT.ELEVEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + // .click(Selector('.segment-parent').nth(SEGMENT.ELEVEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) + // .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + // .click(Selector('.segment-parent').nth(SEGMENT.ELEVEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) + // .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) + // .click(Selector('.segment-parent').nth(SEGMENT.SIX)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) + // .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.SIX)) + // .expect(Selector('#continue-button').visible).eql(true) + // .expect(Selector('#won-text').visible).eql(true) + // .click(Selector('#continue-button')) + // + // //5. Level + // .expect(Selector('#level-number').textContent).eql("5") + // .expect(Selector('.segment-parent').nth(SEGMENT.ONE).textContent).eql("BEANTOBEALBALEUM") + // .expect(Selector('.segment-parent').nth(SEGMENT.SIX).textContent).eql("NUTUNGNGRGHAIEUS") + // .expect(Selector('.segment-parent').nth(SEGMENT.ONE).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + // .expect(Selector('.segment-parent').nth(SEGMENT.SIX).getStyleProperty('transform')).eql("matrix(0, 1, -1, 0, 0, 0)") + // + // .click(Selector('.segment-parent').nth(SEGMENT.THREE)) + // .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + // .drag(Selector('.segment-parent').nth(SEGMENT.SIX).find('div').withText('U'), 3, 159, { + // offsetX: 69, + // offsetY: 150 + // }) + // .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.THREE)) + // .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + // .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) + // .drag(Selector('.segment-parent').nth(SEGMENT.SIX), 3, 123, { + // offsetX: 86, + // offsetY: 133 + // }) + // .click(Selector('.segment-parent').nth(SEGMENT.THREE)) + // .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + // .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) + // .drag(Selector('.segment-parent').nth(SEGMENT.SIX), 10, 123, { + // offsetX: 60, + // offsetY: 137 + // }) + // .expect(Selector('#won-text').visible).eql(true) + // .expect(Selector('#continue-button').visible).eql(true) + // .click(Selector('#continue-button')) + // + // + // //Level 6 + // .expect(Selector('#level-number').textContent).eql("6") + // .expect(Selector('.segment-parent').nth(SEGMENT.ONE).textContent).eql("FEGEHLISARBEBERE") + // .expect(Selector('.segment-parent').nth(SEGMENT.ONE).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + // .expect(Selector('.segment-parent').nth(SEGMENT.TEN).getStyleProperty('transform')).eql("matrix(-1, 0, 0, -1, 0, 0)") + // .expect(Selector('.segment-parent').nth(SEGMENT.TEN).textContent).eql("ITITSPSCIKARAROT") + // + // .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + // .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.NINE)) + // .drag(Selector('.segment-parent').nth(SEGMENT.TEN).find('div').withText('A'), 106, -4, { + // offsetX: 33, + // offsetY: 18 + // }) + // .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + // .click(Selector('.segment-parent').nth(SEGMENT.SIX)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWENTY)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) + // .click(Selector('.segment-parent').nth(SEGMENT.NINE)) + // .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWENTYONE)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + // .click(Selector('.segment-parent').nth(SEGMENT.EIGHT)) + // .click(Selector('.segment-parent').nth(SEGMENT.ELEVEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.NINE)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) + // .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + // .click(Selector('.segment-parent').nth(SEGMENT.FOURTEEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.SIXTEEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) + // .click(Selector('.segment-parent').nth(SEGMENT.NINETEEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWENTYONE)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWENTY)) + // .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWENTY)) + // .click(Selector('.segment-parent').nth(SEGMENT.SEVENTEEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.SIXTEEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.FOURTEEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.NINETEEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWENTYONE)) + // .drag(Selector('.segment-parent').nth(SEGMENT.TEN).find('div').withText('P'), 169, -3, { + // offsetX: 22, + // offsetY: 16 + // }) + // .expect(Selector('div').withText('P').nth(11).find('.segment.segment-parent.layer-2.rotate-360').getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + // .expect(Selector('#continue-button').visible).eql(true) + // .expect(Selector('#won-text').visible).eql(true) + // .click(Selector('#continue-button')) + // + // + // //Level 7 + // .expect(Selector('.segment-parent').nth(SEGMENT.SIX).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + // .expect(Selector('.segment-row > .child-container').childElementCount).eql(3) + // + // .drag(Selector('.segment-parent').nth(SEGMENT.ONE), 4, 177, { + // offsetX: 50, + // offsetY: 73 + // }) + // + // .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + // .drag(Selector('.segment-parent').nth(SEGMENT.ELEVEN), 14, 195, { + // offsetX: 55, + // offsetY: 57 + // }) + // .drag(Selector('.segment-parent').nth(SEGMENT.ONE), 4, 177, { + // offsetX: 50, + // offsetY: 73 + // }) + // .click(Selector('.segment-parent').nth(SEGMENT.THREE)) + // .click(Selector('.segment-parent').nth(SEGMENT.EIGHT)) + // .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + // .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) + // .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + // .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) + // .click(Selector('.segment-parent').nth(SEGMENT.THREE)) + // .click(Selector('.segment-parent').nth(SEGMENT.EIGHT)) + // .click(Selector('.segment-parent').nth(SEGMENT.NINE)) + // .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + // .drag(Selector('.segment-parent').nth(SEGMENT.ELEVEN), 14, 195, { + // offsetX: 55, + // offsetY: 57 + // }) + // .drag(Selector('.segment-parent').nth(SEGMENT.ONE), 4, 177, { + // offsetX: 50, + // offsetY: 73 + // }) + // .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) + // + // .expect(Selector('#won-text').visible).eql(true) + // .expect(Selector('#continue-button').visible).eql(true) + // .click(Selector('#continue-button')) + // .expect(Selector('#site-content').childElementCount).eql(1); }); \ No newline at end of file diff --git a/test/play.testcafe.js b/test/play.testcafe.js index f7f8d98..c3c25a9 100644 --- a/test/play.testcafe.js +++ b/test/play.testcafe.js @@ -1,278 +1,10 @@ import {Selector} from 'testcafe'; +import {mainTest} from "./test"; fixture`Play` .page`https://127.0.0.1/pwa/wordRotator/publicTest/`; test('Play', async t => { - const SEGMENT = { - ONE: 0, - TWO: 1, - THREE: 2, - FOUR: 3, - FIVE: 4, - SIX : 5, - SEVEN: 6, - EIGHT : 7, - NINE: 8, - TEN: 9, - ELEVEN: 10, - TWELVE: 11, - THIRTEEN: 12, - FOURTEEN: 13, - FIFTEEN: 14, - SIXTEEN: 15, - SEVENTEEN: 16, - EIGHTEEN:17, - NINETEEN: 18, - TWENTY:19, - TWENTYONE:20 - }; - - await t - //first Level - .expect(Selector('#level-number').textContent).eql("1") - .expect(Selector('.segment.segment-parent.rotate-90').nth(0).getStyleProperty('transform')).eql("matrix(0, 1, -1, 0, 0, 0)") - .expect(Selector('.segment.segment-parent.rotate-90').nth(1).getStyleProperty('transform')).eql("matrix(0, 1, -1, 0, 0, 0)") - .expect(Selector('.segment.segment-parent.rotate-270').getStyleProperty('transform')).eql("matrix(0, -1, 1, 0, 0, 0)") - .expect(Selector('#won-text').getStyleProperty('visibility')).eql("hidden") - .expect(Selector('#continue-button').getStyleProperty('visibility')).eql("hidden") - .click(Selector('.segment-parent').nth(SEGMENT.THREE)) - .expect(Selector('.segment.segment-parent.rotate-360').getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .click(Selector('.segment-parent').nth(SEGMENT.ONE)) - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .click(Selector('.segment-parent').nth(SEGMENT.ONE)) - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .click(Selector('.segment-parent').nth(SEGMENT.ONE)) - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .expect(Selector('.segment.segment-parent.rotate-360').nth(1).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .expect(Selector('#won-text').visible).eql(true) - .expect(Selector('#continue-button').visible).eql(true) - .click(Selector('#continue-button')) - - //TWOLevel - .expect(Selector('.segment.segment-parent.rotate-270').nth(0).textContent).eql("BOAL") - .expect(Selector('.segment.segment-parent.rotate-180').textContent).eql("DEAR") - .expect(Selector('.segment.segment-parent.rotate-360').textContent).eql("NSMR") - .expect(Selector('.segment.segment-parent.rotate-270').nth(1).textContent).eql("EEUF") - .expect(Selector('.segment.segment-parent.rotate-270').nth(0).getStyleProperty('transform')).eql("matrix(0, -1, 1, 0, 0, 0)") - .expect(Selector('.segment.segment-parent.rotate-180').getStyleProperty('transform')).eql("matrix(-1, 0, 0, -1, 0, 0)") - .expect(Selector('.segment.segment-parent.rotate-360').getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .expect(Selector('.segment.segment-parent.rotate-270').nth(1).getStyleProperty('transform')).eql("matrix(0, -1, 1, 0, 0, 0)") - .expect(Selector('#continue-button').getStyleProperty('visibility')).eql("hidden") - .expect(Selector('#level-number').textContent).eql("2") - .expect(Selector('#won-text').getStyleProperty('visibility')).eql("hidden") - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .click(Selector('.segment-parent').nth(SEGMENT.ONE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .expect(Selector('.segment-parent').nth(SEGMENT.TWO).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .expect(Selector('.segment-parent').nth(SEGMENT.TWO).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .expect(Selector('#won-text').visible).eql(true) - .expect(Selector('#continue-button').visible).eql(true) - .click(Selector('#continue-button')) - - //THREE Level - .expect(Selector('.segment-parent').nth(SEGMENT.ONE).textContent).eql("ZEHO") - .expect(Selector('.segment-parent').nth(SEGMENT.TWO).textContent).eql("ITCH") - .expect(Selector('.segment-parent').nth(SEGMENT.THREE).textContent).eql("STSA") - .expect(Selector('.segment-parent').nth(SEGMENT.FOUR).textContent).eql("RAIS") - .expect(Selector('.segment-parent').nth(SEGMENT.FIVE).textContent).eql("FEON") - .click(Selector('.segment-parent').nth(SEGMENT.ONE)) - .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) - .click(Selector('.segment-parent').nth(SEGMENT.THREE)) - .click(Selector('.segment-parent').nth(SEGMENT.ONE)) - .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) - .click(Selector('.segment-parent').nth(SEGMENT.ONE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) - .click(Selector('#continue-button')) - - //4. Level - .expect(Selector('.segment-parent').nth(SEGMENT.ONE).textContent).eql("FERÜINCKPHREYSSI") - .expect(Selector('.segment-parent').nth(SEGMENT.TWO).textContent).eql("FERÜ") - .expect(Selector('.segment-parent').nth(SEGMENT.THREE).textContent).eql("INCK") - .expect(Selector('.segment-parent').nth(SEGMENT.FOUR).textContent).eql("PHRE") - .expect(Selector('.segment-parent').nth(SEGMENT.FIVE).textContent).eql("YSSI") - .expect(Selector('.segment-parent').nth(SEGMENT.SIX).textContent).eql("BEHE") - .expect(Selector('.segment-parent').nth(SEGMENT.SEVEN).textContent).eql("RARZ") - .expect(Selector('.segment-parent').nth(SEGMENT.EIGHT).textContent).eql("GUFA") - .expect(Selector('.segment-parent').nth(SEGMENT.NINE).textContent).eql("SSLL") - .expect(Selector('.segment-parent').nth(SEGMENT.TEN).textContent).eql("IKDEERNZTULANGND") - .expect(Selector('.segment-parent').nth(SEGMENT.ELEVEN).textContent).eql("IKDE") - .expect(Selector('.segment-parent').nth(SEGMENT.TWELVE).textContent).eql("ERNZ") - .expect(Selector('.segment-parent').nth(SEGMENT.THIRTEEN).textContent).eql("TULA") - .expect(Selector('.segment-parent').nth(SEGMENT.FOURTEEN).textContent).eql("NGND") - .drag(Selector('.segment-parent').nth(SEGMENT.TEN), 128, 4, { - offsetX: 54, - offsetY: 17 - }) - .drag(Selector('.segment-parent').nth(SEGMENT.ONE), 128, 3, { - offsetX: 54, - offsetY: 17 - }) - .drag(Selector('.segment-parent').nth(SEGMENT.TEN).find('div').withText('I'), 128, 4, { - offsetX: 27, - offsetY: 41 - }) - .drag(Selector('.segment-parent').nth(SEGMENT.ONE).find('div').withText('S'), 10, 144, { - offsetX: 64, - offsetY: 32 - }) - .drag(Selector('.segment-parent').nth(SEGMENT.TEN), 128, 4, { - offsetX: 27, - offsetY: 41 - }) - .click(Selector('.segment-parent').nth(SEGMENT.NINE)) - .click(Selector('.segment-parent').nth(SEGMENT.EIGHT)) - .click(Selector('.segment-parent').nth(SEGMENT.NINE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.ELEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.ELEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.ELEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) - .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) - .click(Selector('.segment-parent').nth(SEGMENT.SIX)) - .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) - .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.SIX)) - .expect(Selector('#continue-button').visible).eql(true) - .expect(Selector('#won-text').visible).eql(true) - .click(Selector('#continue-button')) - - //5. Level - .expect(Selector('#level-number').textContent).eql("5") - .expect(Selector('.segment-parent').nth(SEGMENT.ONE).textContent).eql("BEANTOBEALBALEUM") - .expect(Selector('.segment-parent').nth(SEGMENT.SIX).textContent).eql("NUTUNGNGRGHAIEUS") - .expect(Selector('.segment-parent').nth(SEGMENT.ONE).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .expect(Selector('.segment-parent').nth(SEGMENT.SIX).getStyleProperty('transform')).eql("matrix(0, 1, -1, 0, 0, 0)") - - .click(Selector('.segment-parent').nth(SEGMENT.THREE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .drag(Selector('.segment-parent').nth(SEGMENT.SIX).find('div').withText('U'), 3, 159, { - offsetX: 69, - offsetY: 150 - }) - .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.THREE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) - .drag(Selector('.segment-parent').nth(SEGMENT.SIX), 3, 123, { - offsetX: 86, - offsetY: 133 - }) - .click(Selector('.segment-parent').nth(SEGMENT.THREE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) - .drag(Selector('.segment-parent').nth(SEGMENT.SIX), 10, 123, { - offsetX: 60, - offsetY: 137 - }) - .expect(Selector('#won-text').visible).eql(true) - .expect(Selector('#continue-button').visible).eql(true) - .click(Selector('#continue-button')) - - - //Level 6 - .expect(Selector('#level-number').textContent).eql("6") - .expect(Selector('.segment-parent').nth(SEGMENT.ONE).textContent).eql("FEGEHLISARBEBERE") - .expect(Selector('.segment-parent').nth(SEGMENT.ONE).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .expect(Selector('.segment-parent').nth(SEGMENT.TEN).getStyleProperty('transform')).eql("matrix(-1, 0, 0, -1, 0, 0)") - .expect(Selector('.segment-parent').nth(SEGMENT.TEN).textContent).eql("ITITSPSCIKARAROT") - - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.NINE)) - .drag(Selector('.segment-parent').nth(SEGMENT.TEN).find('div').withText('A'), 106, -4, { - offsetX: 33, - offsetY: 18 - }) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.SIX)) - .click(Selector('.segment-parent').nth(SEGMENT.TWENTY)) - .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) - .click(Selector('.segment-parent').nth(SEGMENT.NINE)) - .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.TWENTYONE)) - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .click(Selector('.segment-parent').nth(SEGMENT.EIGHT)) - .click(Selector('.segment-parent').nth(SEGMENT.ELEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.NINE)) - .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.FOURTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.SIXTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) - .click(Selector('.segment-parent').nth(SEGMENT.NINETEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.TWENTYONE)) - .click(Selector('.segment-parent').nth(SEGMENT.TWENTY)) - .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.TWENTY)) - .click(Selector('.segment-parent').nth(SEGMENT.SEVENTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.SIXTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.FOURTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.NINETEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.TWENTYONE)) - .drag(Selector('.segment-parent').nth(SEGMENT.TEN).find('div').withText('P'), 169, -3, { - offsetX: 22, - offsetY: 16 - }) - .expect(Selector('div').withText('P').nth(11).find('.segment.segment-parent.layer-2.rotate-360').getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .expect(Selector('#continue-button').visible).eql(true) - .expect(Selector('#won-text').visible).eql(true) - .click(Selector('#continue-button')) - - - //Level 7 - .expect(Selector('.segment-parent').nth(SEGMENT.SIX).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") - .expect(Selector('.segment-row > .child-container').childElementCount).eql(3) - - .drag(Selector('.segment-parent').nth(SEGMENT.ONE), 4, 177, { - offsetX: 50, - offsetY: 73 - }) - - .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.TWO)) - .drag(Selector('.segment-parent').nth(SEGMENT.ELEVEN), 14, 195, { - offsetX: 55, - offsetY: 57 - }) - .drag(Selector('.segment-parent').nth(SEGMENT.ONE), 4, 177, { - offsetX: 50, - offsetY: 73 - }) - .click(Selector('.segment-parent').nth(SEGMENT.THREE)) - .click(Selector('.segment-parent').nth(SEGMENT.EIGHT)) - .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) - .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) - .click(Selector('.segment-parent').nth(SEGMENT.THREE)) - .click(Selector('.segment-parent').nth(SEGMENT.EIGHT)) - .click(Selector('.segment-parent').nth(SEGMENT.NINE)) - .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) - .drag(Selector('.segment-parent').nth(SEGMENT.ELEVEN), 14, 195, { - offsetX: 55, - offsetY: 57 - }) - .drag(Selector('.segment-parent').nth(SEGMENT.ONE), 4, 177, { - offsetX: 50, - offsetY: 73 - }) - .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) - - .expect(Selector('#won-text').visible).eql(true) - .expect(Selector('#continue-button').visible).eql(true) - .click(Selector('#continue-button')) - .expect(Selector('#site-content').childElementCount).eql(1); + await mainTest(t); }); \ No newline at end of file diff --git a/test/test.js b/test/test.js new file mode 100644 index 0000000..49b27b5 --- /dev/null +++ b/test/test.js @@ -0,0 +1,287 @@ +import { Selector } from 'testcafe'; + +export async function mainTest(t){ + const coinsPerLevel = 5; + const dragDimen = 250; + + const SEGMENT = { + ONE: 0, + TWO: 1, + THREE: 2, + FOUR: 3, + FIVE: 4, + SIX : 5, + SEVEN: 6, + EIGHT : 7, + NINE: 8, + TEN: 9, + ELEVEN: 10, + TWELVE: 11, + THIRTEEN: 12, + FOURTEEN: 13, + FIFTEEN: 14, + SIXTEEN: 15, + SEVENTEEN: 16, + EIGHTEEN:17, + NINETEEN: 18, + TWENTY:19, + TWENTYONE:20 + }; + + await t + //Main Menu + .click(Selector('#play-button')) + + //first Level + .expect(Selector('.segment.segment-parent.rotate-90').nth(0).getStyleProperty('transform')).eql("matrix(0, 1, -1, 0, 0, 0)") + .expect(Selector('.segment.segment-parent.rotate-90').nth(1).getStyleProperty('transform')).eql("matrix(0, 1, -1, 0, 0, 0)") + .expect(Selector('.segment.segment-parent.rotate-270').getStyleProperty('transform')).eql("matrix(0, -1, 1, 0, 0, 0)") + .expect(Selector('#won-text').visible).eql(false) + .expect(Selector('#continue-button').visible).eql(false) + .expect(Selector('#level-number').textContent).eql("1") + .click(Selector('.segment-parent').nth(SEGMENT.THREE)) + .expect(Selector('.segment.segment-parent.rotate-360').getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + .click(Selector('.segment-parent').nth(SEGMENT.ONE)) + .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + .click(Selector('.segment-parent').nth(SEGMENT.ONE)) + .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + .click(Selector('.segment-parent').nth(SEGMENT.ONE)) + .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + .expect(Selector('.segment.segment-parent.rotate-360').nth(1).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + .expect(Selector('#won-text').visible).eql(true) + .expect(Selector('#continue-button').visible).eql(true) + .click(Selector('#continue-button')) + .expect(Selector('.coin-counter').innerText).eql(""+coinsPerLevel) + + //TWOLevel + .expect(Selector('.segment.segment-parent.rotate-270').nth(0).textContent).eql("BOAL") + .expect(Selector('.segment.segment-parent.rotate-180').textContent).eql("DEAR") + .expect(Selector('.segment.segment-parent.rotate-360').textContent).eql("NSMR") + .expect(Selector('.segment.segment-parent.rotate-270').nth(1).textContent).eql("EEUF") + .expect(Selector('.segment.segment-parent.rotate-270').nth(0).getStyleProperty('transform')).eql("matrix(0, -1, 1, 0, 0, 0)") + .expect(Selector('.segment.segment-parent.rotate-180').getStyleProperty('transform')).eql("matrix(-1, 0, 0, -1, 0, 0)") + .expect(Selector('.segment.segment-parent.rotate-360').getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + .expect(Selector('.segment.segment-parent.rotate-270').nth(1).getStyleProperty('transform')).eql("matrix(0, -1, 1, 0, 0, 0)") + .expect(Selector('#continue-button').visible).eql(false) + .expect(Selector('#level-number').textContent).eql("2") + .expect(Selector('#won-text').visible).eql(false) + .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + .click(Selector('.segment-parent').nth(SEGMENT.ONE)) + .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + .expect(Selector('.segment-parent').nth(SEGMENT.TWO).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + .expect(Selector('.segment-parent').nth(SEGMENT.TWO).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + .expect(Selector('#won-text').visible).eql(true) + .expect(Selector('#continue-button').visible).eql(true) + .click(Selector('#continue-button')) + .expect(Selector('.coin-counter').innerText).eql(""+coinsPerLevel*2) + + //THREE Level + .expect(Selector('.segment-parent').nth(SEGMENT.ONE).textContent).eql("ZEHO") + .expect(Selector('.segment-parent').nth(SEGMENT.TWO).textContent).eql("ITCH") + .expect(Selector('.segment-parent').nth(SEGMENT.THREE).textContent).eql("STSA") + .expect(Selector('.segment-parent').nth(SEGMENT.FOUR).textContent).eql("RAIS") + .expect(Selector('.segment-parent').nth(SEGMENT.FIVE).textContent).eql("FEON") + .click(Selector('.segment-parent').nth(SEGMENT.ONE)) + .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) + .click(Selector('.segment-parent').nth(SEGMENT.THREE)) + .click(Selector('.segment-parent').nth(SEGMENT.ONE)) + .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) + .click(Selector('.segment-parent').nth(SEGMENT.ONE)) + .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) + .click(Selector('#continue-button')) + .expect(Selector('.coin-counter').innerText).eql(""+coinsPerLevel*3) + + //4. Level + .expect(Selector('.segment-parent').nth(SEGMENT.ONE).textContent).eql("FERÜINCKPHREYSSI") + .expect(Selector('.segment-parent').nth(SEGMENT.TWO).textContent).eql("FERÜ") + .expect(Selector('.segment-parent').nth(SEGMENT.THREE).textContent).eql("INCK") + .expect(Selector('.segment-parent').nth(SEGMENT.FOUR).textContent).eql("PHRE") + .expect(Selector('.segment-parent').nth(SEGMENT.FIVE).textContent).eql("YSSI") + .expect(Selector('.segment-parent').nth(SEGMENT.SIX).textContent).eql("BEHE") + .expect(Selector('.segment-parent').nth(SEGMENT.SEVEN).textContent).eql("RARZ") + .expect(Selector('.segment-parent').nth(SEGMENT.EIGHT).textContent).eql("GUFA") + .expect(Selector('.segment-parent').nth(SEGMENT.NINE).textContent).eql("SSLL") + .expect(Selector('.segment-parent').nth(SEGMENT.TEN).textContent).eql("IKDEERNZTULANGND") + .expect(Selector('.segment-parent').nth(SEGMENT.ELEVEN).textContent).eql("IKDE") + .expect(Selector('.segment-parent').nth(SEGMENT.TWELVE).textContent).eql("ERNZ") + .expect(Selector('.segment-parent').nth(SEGMENT.THIRTEEN).textContent).eql("TULA") + .expect(Selector('.segment-parent').nth(SEGMENT.FOURTEEN).textContent).eql("NGND") + .drag(Selector('.segment-parent').nth(SEGMENT.TEN), dragDimen, 4, { + offsetX: 54, + offsetY: 17 + }) + .drag(Selector('.segment-parent').nth(SEGMENT.ONE), dragDimen, 3, { + offsetX: 54, + offsetY: 17 + }) + .drag(Selector('.segment-parent').nth(SEGMENT.TEN).find('div').withText('I'), dragDimen, 4, { + offsetX: 27, + offsetY: 41 + }) + .drag(Selector('.segment-parent').nth(SEGMENT.ONE).find('div').withText('S'), 10, dragDimen, { + offsetX: 64, + offsetY: 32 + }) + .drag(Selector('.segment-parent').nth(SEGMENT.TEN), dragDimen, 4, { + offsetX: 27, + offsetY: 41 + }) + .click(Selector('.segment-parent').nth(SEGMENT.NINE)) + .click(Selector('.segment-parent').nth(SEGMENT.EIGHT)) + .click(Selector('.segment-parent').nth(SEGMENT.NINE)) + .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + .click(Selector('.segment-parent').nth(SEGMENT.ELEVEN)) + .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + .click(Selector('.segment-parent').nth(SEGMENT.ELEVEN)) + .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) + .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + .click(Selector('.segment-parent').nth(SEGMENT.ELEVEN)) + .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) + .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) + .click(Selector('.segment-parent').nth(SEGMENT.SIX)) + .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) + .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) + .click(Selector('.segment-parent').nth(SEGMENT.SIX)) + .expect(Selector('#continue-button').visible).eql(true) + .expect(Selector('#won-text').visible).eql(true) + .click(Selector('#continue-button')) + .expect(Selector('.coin-counter').innerText).eql(""+coinsPerLevel*4) + + //5. Level + .expect(Selector('#level-number').textContent).eql("5") + .expect(Selector('.segment-parent').nth(SEGMENT.ONE).textContent).eql("BEANTOBEALBALEUM") + .expect(Selector('.segment-parent').nth(SEGMENT.SIX).textContent).eql("NUTUNGNGRGHAIEUS") + .expect(Selector('.segment-parent').nth(SEGMENT.ONE).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + .expect(Selector('.segment-parent').nth(SEGMENT.SIX).getStyleProperty('transform')).eql("matrix(0, 1, -1, 0, 0, 0)") + + .click(Selector('.segment-parent').nth(SEGMENT.THREE)) + .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + .drag(Selector('.segment-parent').nth(SEGMENT.SIX).find('div').withText('U'), 3, dragDimen, { + offsetX: 69, + offsetY: 150 + }) + .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) + .click(Selector('.segment-parent').nth(SEGMENT.THREE)) + .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) + .drag(Selector('.segment-parent').nth(SEGMENT.SIX), 3, dragDimen, { + offsetX: 86, + offsetY: 133 + }) + .click(Selector('.segment-parent').nth(SEGMENT.THREE)) + .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) + .drag(Selector('.segment-parent').nth(SEGMENT.SIX), 10, dragDimen, { + offsetX: 60, + offsetY: 137 + }) + .expect(Selector('#won-text').visible).eql(true) + .expect(Selector('#continue-button').visible).eql(true) + .click(Selector('#continue-button')) + .expect(Selector('.coin-counter').innerText).eql(""+coinsPerLevel*5) + + + //Level 6 + .expect(Selector('#level-number').textContent).eql("6") + .expect(Selector('.segment-parent').nth(SEGMENT.ONE).textContent).eql("FEGEHLISARBEBERE") + .expect(Selector('.segment-parent').nth(SEGMENT.ONE).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + .expect(Selector('.segment-parent').nth(SEGMENT.TEN).getStyleProperty('transform')).eql("matrix(-1, 0, 0, -1, 0, 0)") + .expect(Selector('.segment-parent').nth(SEGMENT.TEN).textContent).eql("ITITSPSCIKARAROT") + + .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) + .click(Selector('.segment-parent').nth(SEGMENT.NINE)) + .drag(Selector('.segment-parent').nth(SEGMENT.TEN).find('div').withText('A'), dragDimen, -4, { + offsetX: 33, + offsetY: 18 + }) + .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + .click(Selector('.segment-parent').nth(SEGMENT.SIX)) + .click(Selector('.segment-parent').nth(SEGMENT.TWENTY)) + .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) + .click(Selector('.segment-parent').nth(SEGMENT.NINE)) + .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) + .click(Selector('.segment-parent').nth(SEGMENT.TWENTYONE)) + .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + .click(Selector('.segment-parent').nth(SEGMENT.EIGHT)) + .click(Selector('.segment-parent').nth(SEGMENT.ELEVEN)) + .click(Selector('.segment-parent').nth(SEGMENT.NINE)) + .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) + .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + .click(Selector('.segment-parent').nth(SEGMENT.FOURTEEN)) + .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) + .click(Selector('.segment-parent').nth(SEGMENT.SIXTEEN)) + .click(Selector('.segment-parent').nth(SEGMENT.TWELVE)) + .click(Selector('.segment-parent').nth(SEGMENT.NINETEEN)) + .click(Selector('.segment-parent').nth(SEGMENT.TWENTYONE)) + .click(Selector('.segment-parent').nth(SEGMENT.TWENTY)) + .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) + .click(Selector('.segment-parent').nth(SEGMENT.TWENTY)) + .click(Selector('.segment-parent').nth(SEGMENT.SEVENTEEN)) + .click(Selector('.segment-parent').nth(SEGMENT.SIXTEEN)) + .click(Selector('.segment-parent').nth(SEGMENT.FOURTEEN)) + .click(Selector('.segment-parent').nth(SEGMENT.NINETEEN)) + .click(Selector('.segment-parent').nth(SEGMENT.TWENTYONE)) + .drag(Selector('.segment-parent').nth(SEGMENT.TEN).find('div').withText('P'), dragDimen, -3, { + offsetX: 22, + offsetY: 16 + }) + .expect(Selector('div').withText('P').nth(11).find('.segment.segment-parent.layer-2.rotate-360').getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + .expect(Selector('#continue-button').visible).eql(true) + .expect(Selector('#won-text').visible).eql(true) + .click(Selector('#continue-button')) + .expect(Selector('.coin-counter').innerText).eql(""+coinsPerLevel*6) + + + //Level 7 + .expect(Selector('.segment-parent').nth(SEGMENT.SIX).getStyleProperty('transform')).eql("matrix(1, 0, 0, 1, 0, 0)") + .expect(Selector('.segment-row > .child-container').childElementCount).eql(3) + + .drag(Selector('.segment-parent').nth(SEGMENT.ONE), 4, dragDimen, { + offsetX: 50, + offsetY: 73 + }) + + .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) + .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) + .click(Selector('.segment-parent').nth(SEGMENT.TWO)) + .drag(Selector('.segment-parent').nth(SEGMENT.ELEVEN), 14, dragDimen, { + offsetX: 55, + offsetY: 57 + }) + .drag(Selector('.segment-parent').nth(SEGMENT.ONE), 4, dragDimen, { + offsetX: 50, + offsetY: 73 + }) + .click(Selector('.segment-parent').nth(SEGMENT.THREE)) + .click(Selector('.segment-parent').nth(SEGMENT.EIGHT)) + .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) + .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) + .click(Selector('.segment-parent').nth(SEGMENT.FIVE)) + .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + .click(Selector('.segment-parent').nth(SEGMENT.SEVEN)) + .click(Selector('.segment-parent').nth(SEGMENT.THREE)) + .click(Selector('.segment-parent').nth(SEGMENT.EIGHT)) + .click(Selector('.segment-parent').nth(SEGMENT.NINE)) + .click(Selector('.segment-parent').nth(SEGMENT.FOUR)) + .drag(Selector('.segment-parent').nth(SEGMENT.ELEVEN), 14, dragDimen, { + offsetX: 55, + offsetY: 57 + }) + .drag(Selector('.segment-parent').nth(SEGMENT.ONE), 4, dragDimen, { + offsetX: 50, + offsetY: 73 + }) + .click(Selector('.segment-parent').nth(SEGMENT.THIRTEEN)) + .expect(Selector('.coin-counter').innerText).eql(""+coinsPerLevel*7) + + .expect(Selector('#won-text').visible).eql(true) + .expect(Selector('#continue-button').visible).eql(true) + .click(Selector('#continue-button')) + .expect(Selector('#site-content').childElementCount).eql(1); +} \ No newline at end of file