diff --git a/jest.config.ts b/jest.config.ts index 3e9459f2..f2efca96 100644 --- a/jest.config.ts +++ b/jest.config.ts @@ -17,7 +17,7 @@ export default { clearMocks: true, // Indicates whether the coverage information should be collected while executing the test - collectCoverage: true, + collectCoverage: true, // An array of glob patterns indicating a set of files for which coverage information should be collected // collectCoverageFrom: undefined, @@ -26,9 +26,7 @@ export default { coverageDirectory: 'coverage', // An array of regexp pattern strings used to skip coverage collection - // coveragePathIgnorePatterns: [ - // "/node_modules/" - // ], + coveragePathIgnorePatterns: ['/node_modules/', 'setupTests.ts', 'setUpTests.ts'], // Indicates which provider should be used to instrument code for coverage coverageProvider: 'v8', diff --git a/templates/panel/sitekey/add/ts/const.ts b/templates/panel/sitekey/add/ts/const.ts index d85c5b17..334850b8 100644 --- a/templates/panel/sitekey/add/ts/const.ts +++ b/templates/panel/sitekey/add/ts/const.ts @@ -29,6 +29,7 @@ const LEVEL_FIELDSET_ID_WITHOUT_LEVEL = 'level-group-'; const LEGEND_CLASS = 'sitekey__level-title'; const REMOVE_LEVEL_BUTTON_ID_WITHOUT_LEVEL = 'remove-level'; +const REMOVE_LEVEL_BUTTON_CLASS = 'sitekey-form__level-remove-level-button'; const REMOVE_LEVEL_LABEL_TEXT = 'Remove Level'; const REMOVE_LEVEL_LABEL_CLASS = 'sitekey-form__level-label--hidden'; @@ -48,6 +49,7 @@ const CONST = { REMOVE_LEVEL_LABEL_CLASS, REMOVE_LEVEL_BUTTON_ID_WITHOUT_LEVEL, REMOVE_LEVEL_LABEL_TEXT, + REMOVE_LEVEL_BUTTON_CLASS, }; export default CONST; diff --git a/templates/panel/sitekey/add/ts/removeLevelButton/index.ts b/templates/panel/sitekey/add/ts/removeLevelButton/index.ts index 0e4cf8d9..dfc09694 100644 --- a/templates/panel/sitekey/add/ts/removeLevelButton/index.ts +++ b/templates/panel/sitekey/add/ts/removeLevelButton/index.ts @@ -72,7 +72,7 @@ export const getRemoveButtonHTML = (level: number) => { const HTML = ` ${CONST.REMOVE_LEVEL_LABEL_TEXT} { setUp(); - // for (let i = 1; i < 4; i++) { - // const l1 = ( - // document.getElementById( - // `${CONST.REMOVE_LEVEL_BUTTON_ID_WITHOUT_LEVEL}${1}`, - // ) - // ); - // - // const expecting = 4 - i; - // const currentLevels = getNumLevels(); - // log.log( - // `current iteration: ${i}. expecting val: ${expecting} got: ${currentLevels}`, - // ); - // - // l1.click(); - // expect(currentLevels).toBe(expecting); - // - // - // } + for (let i = 1; i < 4; i++) { + const l1 = ( + document.getElementById( + `${CONST.REMOVE_LEVEL_BUTTON_ID_WITHOUT_LEVEL}${1}`, + ) + ); - let a = document.body.innerHTML; - expect(trim(a)).toBe(trim(getRemoveButtonHTMLForm())); + const expecting = 4 - i; - const l1 = ( - document.getElementById(`${CONST.REMOVE_LEVEL_BUTTON_ID_WITHOUT_LEVEL}${1}`) - ); - - const expecting = 4 - 1; - const currentLevels = getNumLevels(); - log.log( - `current iteration: ${1}. expecting val: ${expecting} got: ${currentLevels}`, - ); - - l1.click(); - - a = document.body.innerHTML; - //console.log(a); - // expect(currentLevels).toBe(expecting); - //document.body.innerHTML; - // expect(trim(a)).toBe(trim(getRemoveButtonHTMLForm())); - // + l1.click(); + const currentLevels = getNumLevels(); + expect(currentLevels).toBe(expecting); + } }); diff --git a/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/index.ts b/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/index.ts index 89193675..2de0b8c7 100644 --- a/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/index.ts +++ b/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/index.ts @@ -20,6 +20,8 @@ import log from '../../../../../../logger'; import updateLabels from './updateLabel'; import updateInputs from './updateInputs'; +import updateRemoveButton from './updateRemoveButton'; +import updateLevelGroup from './updateLevelGroup'; /** * update level number on fieldset legends and their ids too @@ -61,9 +63,14 @@ const updateLevelNumbersOnDOM = (id: number) => { // rename inputs updateInputs(levelGroup, newLevel); - // TODO change remove button ID as well + if (i != numLevels) { + // update remove button + updateRemoveButton(levelGroup, newLevel); + } - levelGroup.id = `${CONST.LEVEL_FIELDSET_ID_WITHOUT_LEVEL}${newLevel}`; + // update levelGroup's ID + updateLevelGroup(levelGroup, newLevel); + // TODO change remove button ID as well /* TODO * change field set ID diff --git a/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateInputs.ts b/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateInputs.ts index fe91e744..6d976d7a 100644 --- a/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateInputs.ts +++ b/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateInputs.ts @@ -17,6 +17,7 @@ import CONST from '../../const'; import log from '../../../../../../logger'; +/** update input IDs with new level */ const updateInput = (levelGroup: Element, newLevel: number) => { const inputs = >( levelGroup.querySelectorAll(`.${CONST.LEVEL_INPUT_CLASS}`) diff --git a/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateLabel.ts b/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateLabel.ts index 486a1e69..f3f4555f 100644 --- a/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateLabel.ts +++ b/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateLabel.ts @@ -17,6 +17,7 @@ import CONST from '../../const'; import log from '../../../../../../logger'; +/** update level lables to match new level */ const updateLabels = (levelGroup: Element, newLevel: number) => { // rename labels const labels = >( diff --git a/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateLevelGroup.test.ts b/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateLevelGroup.test.ts new file mode 100644 index 00000000..0fbb21fa --- /dev/null +++ b/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateLevelGroup.test.ts @@ -0,0 +1,103 @@ +/* + * Copyright (C) 221 Aravinth Manivannan + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as + * published by the Free Software Foundation, either version 3 of the + * License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ + +import getNumLevels from '../../levels/getNumLevels'; +import {getAddForm, trim} from '../../setupTests'; +import updateLevelGroup from './updateLevelGroup'; +import CONST from '../../const'; + +import log from '../../../../../../logger'; +import {MODE} from '../../../../../../logger'; + +import {setupAddlevels} from './setupTests'; + +/** get initial form to test remove button functionality */ +export const labelLevel = (level: number) => { + return ` +
+
+ + Level 2 + + + + + + + + +
+
+`; +}; + +document.body.innerHTML = labelLevel(2); + +log.setMode(MODE.none); + +it('update levelGroup works', () => { + // removing level 2 + const level = 2; + const levelGroup = document.querySelector( + `#${CONST.LEVEL_FIELDSET_ID_WITHOUT_LEVEL}${level}`, + ); + + const newLevel = 20; + + updateLevelGroup(levelGroup, newLevel); + expect(levelGroup.id).toBe( + `${CONST.LEVEL_FIELDSET_ID_WITHOUT_LEVEL}${newLevel}`, + ); + + expect(trim(document.body.innerHTML)).toBe(trim(labelLevel(newLevel))); +}); diff --git a/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateLevelGroup.ts b/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateLevelGroup.ts new file mode 100644 index 00000000..c91152c5 --- /dev/null +++ b/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateLevelGroup.ts @@ -0,0 +1,23 @@ +/* + * Copyright (C) 2021 Aravinth Manivannan + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as + * published by the Free Software Foundation, either version 3 of the + * License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ +import CONST from '../../const'; + +/** update level grup to match new level */ +const updateLevelGroup = (levelGroup: Element, newLevel: number) => + (levelGroup.id = `${CONST.LEVEL_FIELDSET_ID_WITHOUT_LEVEL}${newLevel}`); + +export default updateLevelGroup; diff --git a/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateRemoveButton.test.ts b/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateRemoveButton.test.ts new file mode 100644 index 00000000..51f4c98d --- /dev/null +++ b/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateRemoveButton.test.ts @@ -0,0 +1,107 @@ +/* + * Copyright (C) 221 Aravinth Manivannan + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as + * published by the Free Software Foundation, either version 3 of the + * License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ + +import {trim} from '../../setupTests'; +import updateRemoveButton from './updateRemoveButton'; +import CONST from '../../const'; + +import log from '../../../../../../logger'; +import {MODE} from '../../../../../../logger'; + +/** get initial form to test remove button functionality */ +export const labelLevel = (level: number) => { + return ` +
+
+ + Level 2 + + + + + + + + +
+
+`; +}; + +const level = 2; +document.body.innerHTML = labelLevel(level); + +log.setMode(MODE.none); + +it('update remove button works', () => { + // removing level 2 + + const levelGroup = document.getElementById( + `${CONST.LEVEL_FIELDSET_ID_WITHOUT_LEVEL}`, + ); + + const newLevel = 20; + updateRemoveButton(levelGroup, newLevel); + + const button = ( + levelGroup.querySelector(`.${CONST.REMOVE_LEVEL_BUTTON_CLASS}`) + ); + expect(button.id).toBe( + `${CONST.REMOVE_LEVEL_BUTTON_ID_WITHOUT_LEVEL}${newLevel}`, + ); + expect(button.name).toBe( + `${CONST.REMOVE_LEVEL_BUTTON_ID_WITHOUT_LEVEL}${newLevel}`, + ); + + expect(trim(document.body.innerHTML)).toBe(trim(labelLevel(newLevel))); +}); diff --git a/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateRemoveButton.ts b/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateRemoveButton.ts new file mode 100644 index 00000000..813ed726 --- /dev/null +++ b/templates/panel/sitekey/add/ts/removeLevelButton/updateDom/updateRemoveButton.ts @@ -0,0 +1,30 @@ +/* + * Copyright (C) 2021 Aravinth Manivannan + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as + * published by the Free Software Foundation, either version 3 of the + * License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ +import CONST from '../../const'; + +/** update remove level button's ID */ +const updateRemoveButton = (levelGroup: Element, newLevel: number) => { + // rename button + const button = ( + levelGroup.querySelector(`.${CONST.REMOVE_LEVEL_BUTTON_CLASS}`) + ); + const id = `${CONST.REMOVE_LEVEL_BUTTON_ID_WITHOUT_LEVEL}${newLevel}`; + button.id = id; + button.name = id; +}; + +export default updateRemoveButton;