Skip to content
This repository has been archived by the owner on Dec 24, 2023. It is now read-only.

Commit

Permalink
Merge pull request #34 from wswebcreation/fix/allow-element-array
Browse files Browse the repository at this point in the history 
fix: this fixes issue12
  • Loading branch information
@wswebcreation
wswebcreation committed Oct 3, 2019
2 parents e9872d9 + 7737f11 commit 4a521e1
Show file tree
Hide file tree
Showing 5 changed files with 176 additions and 12 deletions.
48 changes: 48 additions & 0 deletions lib/clientSideScripts/__snapshots__/hideRemoveElements.spec.ts.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,30 @@ exports[`hideRemoveElements should be able to hide elements and put them back ag

exports[`hideRemoveElements should be able to hide elements and put them back again 6`] = `""`;

exports[`hideRemoveElements should be able to hide elements and put them back again when an array of hidden elements is provided 1`] = `""`;

exports[`hideRemoveElements should be able to hide elements and put them back again when an array of hidden elements is provided 2`] = `""`;

exports[`hideRemoveElements should be able to hide elements and put them back again when an array of hidden elements is provided 3`] = `""`;

exports[`hideRemoveElements should be able to hide elements and put them back again when an array of hidden elements is provided 4`] = `""`;

exports[`hideRemoveElements should be able to hide elements and put them back again when an array of hidden elements is provided 5`] = `"hidden"`;

exports[`hideRemoveElements should be able to hide elements and put them back again when an array of hidden elements is provided 6`] = `"hidden"`;

exports[`hideRemoveElements should be able to hide elements and put them back again when an array of hidden elements is provided 7`] = `""`;

exports[`hideRemoveElements should be able to hide elements and put them back again when an array of hidden elements is provided 8`] = `"hidden"`;

exports[`hideRemoveElements should be able to hide elements and put them back again when an array of hidden elements is provided 9`] = `""`;

exports[`hideRemoveElements should be able to hide elements and put them back again when an array of hidden elements is provided 10`] = `""`;

exports[`hideRemoveElements should be able to hide elements and put them back again when an array of hidden elements is provided 11`] = `""`;

exports[`hideRemoveElements should be able to hide elements and put them back again when an array of hidden elements is provided 12`] = `""`;

exports[`hideRemoveElements should be able to remove elements and put them back again 1`] = `""`;

exports[`hideRemoveElements should be able to remove elements and put them back again 2`] = `""`;
Expand All @@ -23,3 +47,27 @@ exports[`hideRemoveElements should be able to remove elements and put them back
exports[`hideRemoveElements should be able to remove elements and put them back again 5`] = `""`;

exports[`hideRemoveElements should be able to remove elements and put them back again 6`] = `""`;

exports[`hideRemoveElements should be able to remove elements and put them back again when an array of to be removed elements is provided 1`] = `""`;

exports[`hideRemoveElements should be able to remove elements and put them back again when an array of to be removed elements is provided 2`] = `""`;

exports[`hideRemoveElements should be able to remove elements and put them back again when an array of to be removed elements is provided 3`] = `""`;

exports[`hideRemoveElements should be able to remove elements and put them back again when an array of to be removed elements is provided 4`] = `""`;

exports[`hideRemoveElements should be able to remove elements and put them back again when an array of to be removed elements is provided 5`] = `"none"`;

exports[`hideRemoveElements should be able to remove elements and put them back again when an array of to be removed elements is provided 6`] = `"none"`;

exports[`hideRemoveElements should be able to remove elements and put them back again when an array of to be removed elements is provided 7`] = `""`;

exports[`hideRemoveElements should be able to remove elements and put them back again when an array of to be removed elements is provided 8`] = `"none"`;

exports[`hideRemoveElements should be able to remove elements and put them back again when an array of to be removed elements is provided 9`] = `""`;

exports[`hideRemoveElements should be able to remove elements and put them back again when an array of to be removed elements is provided 10`] = `""`;

exports[`hideRemoveElements should be able to remove elements and put them back again when an array of to be removed elements is provided 11`] = `""`;

exports[`hideRemoveElements should be able to remove elements and put them back again when an array of to be removed elements is provided 12`] = `""`;
102 changes: 98 additions & 4 deletions lib/clientSideScripts/hideRemoveElements.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ describe('hideRemoveElements', () => {
expect((<HTMLElement>document.querySelector('#id-3')).style.visibility).toMatchSnapshot();

hideRemoveElements({
hide: [document.querySelector('#id-1'), document.querySelector('#id-3')],
hide: [<HTMLElement>document.querySelector('#id-1'), <HTMLElement>document.querySelector('#id-3')],
remove: [],
},
true,
Expand All @@ -28,7 +28,7 @@ describe('hideRemoveElements', () => {
expect((<HTMLElement>document.querySelector('#id-3')).style.visibility).toMatchSnapshot();

hideRemoveElements({
hide: [document.querySelector('#id-1'), document.querySelector('#id-3')],
hide: [<HTMLElement>document.querySelector('#id-1'), <HTMLElement>document.querySelector('#id-3')],
remove: [],
},
false,
Expand All @@ -39,6 +39,50 @@ describe('hideRemoveElements', () => {
expect((<HTMLElement>document.querySelector('#id-3')).style.visibility).toMatchSnapshot();
});

it('should be able to hide elements and put them back again when an array of hidden elements is provided', () => {
document.body.innerHTML =
'<div>' +
' <span class="hide">Hello</span>' +
' <span class="hide">Hello</span>' +
' <div>' +
' <span id="id-3">Hello</span>' +
' <span class="hide">Hello</span>' +
' </div>' +
'</div>';

// Check not hidden
expect((<HTMLElement[]><unknown>document.querySelectorAll('.hide'))[0].style.visibility).toMatchSnapshot();
expect((<HTMLElement[]><unknown>document.querySelectorAll('.hide'))[1].style.visibility).toMatchSnapshot();
expect((<HTMLElement>document.querySelector('#id-3')).style.visibility).toMatchSnapshot();
expect((<HTMLElement[]><unknown>document.querySelectorAll('.hide'))[2].style.visibility).toMatchSnapshot();

hideRemoveElements({
hide: [[...<HTMLElement[]><unknown>document.querySelectorAll('.hide')]],
remove: [],
},
true,
);

// Check hidden
expect((<HTMLElement[]><unknown>document.querySelectorAll('.hide'))[0].style.visibility).toMatchSnapshot();
expect((<HTMLElement[]><unknown>document.querySelectorAll('.hide'))[1].style.visibility).toMatchSnapshot();
expect((<HTMLElement>document.querySelector('#id-3')).style.visibility).toMatchSnapshot();
expect((<HTMLElement[]><unknown>document.querySelectorAll('.hide'))[2].style.visibility).toMatchSnapshot();

hideRemoveElements({
hide: [[...<HTMLElement[]><unknown>document.querySelectorAll('.hide')]],
remove: [],
},
false,
);

// Check not hidden
expect((<HTMLElement[]><unknown>document.querySelectorAll('.hide'))[0].style.visibility).toMatchSnapshot();
expect((<HTMLElement[]><unknown>document.querySelectorAll('.hide'))[1].style.visibility).toMatchSnapshot();
expect((<HTMLElement>document.querySelector('#id-3')).style.visibility).toMatchSnapshot();
expect((<HTMLElement[]><unknown>document.querySelectorAll('.hide'))[2].style.visibility).toMatchSnapshot();
});

it('should be able to remove elements and put them back again', () => {
document.body.innerHTML =
'<div>' +
Expand All @@ -56,7 +100,10 @@ describe('hideRemoveElements', () => {

hideRemoveElements({
hide: [],
remove: [document.querySelector('#id-2'), document.querySelector('#id-4')],
remove: [
<HTMLElement>document.querySelector('#id-2'),
<HTMLElement>document.querySelector('#id-4'),
],
},
true,
);
Expand All @@ -66,7 +113,10 @@ describe('hideRemoveElements', () => {
expect((<HTMLElement>document.querySelector('#id-4')).style.display).toMatchSnapshot();

hideRemoveElements({
remove: [document.querySelector('#id-2'), document.querySelector('#id-4')],
remove: [
<HTMLElement>document.querySelector('#id-2'),
<HTMLElement>document.querySelector('#id-4'),
],
hide: [],
},
false,
Expand All @@ -76,4 +126,48 @@ describe('hideRemoveElements', () => {
expect((<HTMLElement>document.querySelector('#id-2')).style.display).toMatchSnapshot();
expect((<HTMLElement>document.querySelector('#id-4')).style.display).toMatchSnapshot();
});

it('should be able to remove elements and put them back again when an array of to be removed elements is provided', () => {
document.body.innerHTML =
'<div>' +
' <span class="remove">Hello</span>' +
' <span class="remove">Hello</span>' +
' <div>' +
' <span id="id-3">Hello</span>' +
' <span class="remove">Hello</span>' +
' </div>' +
'</div>';

// Check not hidden
expect((<HTMLElement[]><unknown>document.querySelectorAll('.remove'))[0].style.display).toMatchSnapshot();
expect((<HTMLElement[]><unknown>document.querySelectorAll('.remove'))[1].style.display).toMatchSnapshot();
expect((<HTMLElement>document.querySelector('#id-3')).style.display).toMatchSnapshot();
expect((<HTMLElement[]><unknown>document.querySelectorAll('.remove'))[2].style.display).toMatchSnapshot();

hideRemoveElements({
remove: [[...<HTMLElement[]><unknown>document.querySelectorAll('.remove')]],
hide: [],
},
true,
);

// Check hidden
expect((<HTMLElement[]><unknown>document.querySelectorAll('.remove'))[0].style.display).toMatchSnapshot();
expect((<HTMLElement[]><unknown>document.querySelectorAll('.remove'))[1].style.display).toMatchSnapshot();
expect((<HTMLElement>document.querySelector('#id-3')).style.display).toMatchSnapshot();
expect((<HTMLElement[]><unknown>document.querySelectorAll('.remove'))[2].style.display).toMatchSnapshot();

hideRemoveElements({
remove: [[...<HTMLElement[]><unknown>document.querySelectorAll('.remove')]],
hide: [],
},
false,
);

// Check not hidden
expect((<HTMLElement[]><unknown>document.querySelectorAll('.remove'))[0].style.display).toMatchSnapshot();
expect((<HTMLElement[]><unknown>document.querySelectorAll('.remove'))[1].style.display).toMatchSnapshot();
expect((<HTMLElement>document.querySelector('#id-3')).style.display).toMatchSnapshot();
expect((<HTMLElement[]><unknown>document.querySelectorAll('.remove'))[2].style.display).toMatchSnapshot();
});
});
28 changes: 25 additions & 3 deletions lib/clientSideScripts/hideRemoveElements.ts
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,29 @@
/**
* Hide or remove elements on the page
*/
export default function hideRemoveElements(hideRemoveElements: { hide: HTMLElement[], remove: HTMLElement[] }, hideRemove: boolean): void {
hideRemoveElements.hide.forEach(element => element.style.visibility = hideRemove ? 'hidden' : '');
hideRemoveElements.remove.forEach(element => element.style.display = hideRemove ? 'none' : '');
export default function hideRemoveElements(
hideRemoveElements:
{
hide: (HTMLElement | HTMLElement[])[],
remove: (HTMLElement | HTMLElement[])[],
},
hideRemove: boolean): void {

hideRemoveElements.hide.forEach(element => {
if (Array.isArray(element)) {
return element.forEach(singleElement => {
singleElement.style.visibility = hideRemove ? 'hidden' : '';
});
}

return element.style.visibility = hideRemove ? 'hidden' : '';
});

hideRemoveElements.remove.forEach(element => {
if (Array.isArray(element)) {
return element.forEach(singleElement => singleElement.style.display = hideRemove ? 'none' : '');
}

return element.style.display = hideRemove ? 'none' : '';
});
}
4 changes: 2 additions & 2 deletions lib/helpers/afterScreenshot.interfaces.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,11 +21,11 @@ export interface AfterScreenshotOptions {
// The file name options object
fileName: ScreenshotFileNameOptions;
// Elements that need to be hidden (visibility: hidden) before saving a screenshot
hideElements: HTMLElement[];
hideElements: (HTMLElement | HTMLElement[])[];
// The platform name of the instance
platformName: string;
// Elements that need to be removed (display: none) before saving a screenshot
removeElements: HTMLElement[];
removeElements: (HTMLElement | HTMLElement[])[];
}

export interface ScreenshotFilePathOptions {
Expand Down
6 changes: 3 additions & 3 deletions lib/methods/screenshots.interfaces.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ export interface FullPageScreenshotDataOptions {
// The amount of milliseconds to wait for a new scroll
fullPageScrollTimeout: number;
// Elements that need to be hidden after the first scroll for a fullpage scroll
hideAfterFirstScroll: HTMLElement[];
hideAfterFirstScroll: (HTMLElement | HTMLElement[])[];
// The innerheight
innerHeight: number;
// If the instance is an Android device
Expand Down Expand Up @@ -58,7 +58,7 @@ export interface FullPageScreenshotNativeMobileOptions {
// The address bar padding for iOS or Android
toolBarShadowPadding: number;
// Elements that need to be hidden after the first scroll for a fullpage scroll
hideAfterFirstScroll: HTMLElement[];
hideAfterFirstScroll: (HTMLElement | HTMLElement[])[];
}

export interface FullPageScreenshotOptions {
Expand All @@ -69,5 +69,5 @@ export interface FullPageScreenshotOptions {
// The innerheight
innerHeight: number;
// Elements that need to be hidden after the first scroll for a fullpage scroll
hideAfterFirstScroll: HTMLElement[];
hideAfterFirstScroll: (HTMLElement | HTMLElement[])[];
}

0 comments on commit 4a521e1

Please sign in to comment.