Skip to content

Commit abe6c3f

Browse files
AbbanAbban
authored
Merge pull request #162 from wmde/close-event-tests
Move banner close event tests
2 parents ed07d77 + 21ecd76 commit abe6c3f

File tree

22 files changed

+139
-8
lines changed

22 files changed

+139
-8
lines changed

‎.stylelintrc.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
"stylelint-config-wikimedia"
99
],
1010
"rules": {
11+
"max-line-length": 180,
1112
"selector-max-id": 2,
1213
"function-url-quotes": "always",
1314
"color-hex-length": "long",

‎banners/mobile/components/BannerCtrl.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717

1818
<FullPageBanner
1919
@showFundsModal="isFundsModalVisible = true"
20-
@close="() => onClose( 'FullPageBanner', CloseChoices.Close )"
20+
@close="() => onClose( 'FullPageBanner', CloseChoices.Hide )"
2121
>
2222
<template #banner-text>
2323
<BannerText/>

‎banners/mobile_english/components/BannerCtrl.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717

1818
<FullPageBanner
1919
@showFundsModal="isFundsModalVisible = true"
20-
@close="() => onClose( 'FullPageBanner', CloseChoices.Close )"
20+
@close="() => onClose( 'FullPageBanner', CloseChoices.Hide )"
2121
>
2222
<template #banner-text>
2323
<BannerText/>

‎banners/mobile_english/components/BannerVar.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717

1818
<FullPageBanner
1919
@showFundsModal="isFundsModalVisible = true"
20-
@close="() => onClose( 'FullPageBanner', CloseChoices.Close )"
20+
@close="() => onClose( 'FullPageBanner', CloseChoices.Hide )"
2121
>
2222
<template #banner-text>
2323
<BannerText/>

‎banners/wpde_mobile/components/BannerCtrl.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717

1818
<FullPageBanner
1919
@showFundsModal="isFundsModalVisible = true"
20-
@close="() => onClose( 'FullPageBanner', CloseChoices.Close )"
20+
@close="() => onClose( 'FullPageBanner', CloseChoices.Hide )"
2121
>
2222
<template #banner-text>
2323
<BannerText/>

‎src/domain/CloseChoices.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
export enum CloseChoices {
22
/** user clicked close button */
33
Close = 'close',
4+
/** user clicked close button on a mobile full page banner */
5+
Hide = 'hide',
46
/** user clicked maybe later button */
57
MaybeLater = 'maybe-later',
68
/** user ignored soft close timer */

‎src/page/PageWPORG.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -109,6 +109,7 @@ class PageWPORG implements Page {
109109
case CloseChoices.NoMoreBannersForCampaign:
110110
this._mediaWiki.preventBannerDisplayUntilEndOfCampaign();
111111
break;
112+
case CloseChoices.Hide:
112113
case CloseChoices.MaybeLater:
113114
// Don't add cookie
114115
break;

‎test/banners/desktop/components/BannerCtrl.spec.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import { donationFormFeatures } from '@test/features/forms/MainDonation_UpgradeT
1818
import { useFormModel } from '@src/components/composables/useFormModel';
1919
import { resetFormModel } from '@test/resetFormModel';
2020
import { DynamicContent } from '@src/utils/DynamicContent/DynamicContent';
21+
import { bannerMainFeatures } from '@test/features/MainBanner';
2122

2223
const formModel = useFormModel();
2324
const translator = ( key: string ): string => key;
@@ -50,6 +51,14 @@ describe( 'BannerCtrl.vue', () => {
5051
} );
5152
};
5253

54+
describe( 'Main Banner', () => {
55+
test.each( [
56+
[ 'expectDoesNotEmitCloseEvent' ]
57+
] )( '%s', async ( testName: string ) => {
58+
await bannerMainFeatures[ testName ]( getWrapper() );
59+
} );
60+
} );
61+
5362
describe( 'Content', () => {
5463
test.each( [
5564
[ 'expectSlideShowPlaysWhenBecomesVisible' ],

‎test/banners/desktop/components/BannerVar.spec.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import { donationFormFeatures } from '@test/features/forms/MainDonation_UpgradeT
1818
import { useFormModel } from '@src/components/composables/useFormModel';
1919
import { resetFormModel } from '@test/resetFormModel';
2020
import { DynamicContent } from '@src/utils/DynamicContent/DynamicContent';
21+
import { bannerMainFeatures } from '@test/features/MainBanner';
2122

2223
const formModel = useFormModel();
2324
const translator = ( key: string ): string => key;
@@ -50,6 +51,14 @@ describe( 'BannerVar.vue', () => {
5051
} );
5152
};
5253

54+
describe( 'Main Banner', () => {
55+
test.each( [
56+
[ 'expectDoesNotEmitCloseEvent' ]
57+
] )( '%s', async ( testName: string ) => {
58+
await bannerMainFeatures[ testName ]( getWrapper() );
59+
} );
60+
} );
61+
5362
describe( 'Content', () => {
5463
test.each( [
5564
[ 'expectSlideShowPlaysWhenBecomesVisible' ],

‎test/banners/english/components/BannerCtrl.spec.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import { TrackerStub } from '@test/fixtures/TrackerStub';
1313
import { donationFormFeatures } from '@test/features/forms/MainDonation_UpgradeToYearly_CustomAmount';
1414
import { useFormModel } from '@src/components/composables/useFormModel';
1515
import { resetFormModel } from '@test/resetFormModel';
16+
import { bannerMainFeatures } from '@test/features/MainBanner';
1617

1718
const formModel = useFormModel();
1819
const translator = ( key: string ): string => key;
@@ -45,6 +46,14 @@ describe( 'BannerCtrl.vue', () => {
4546
} );
4647
};
4748

49+
describe( 'Main Banner', () => {
50+
test.each( [
51+
[ 'expectDoesNotEmitCloseEvent' ]
52+
] )( '%s', async ( testName: string ) => {
53+
await bannerMainFeatures[ testName ]( getWrapper() );
54+
} );
55+
} );
56+
4857
describe( 'Content', () => {
4958
test.each( [
5059
[ 'expectSlideShowPlaysWhenBecomesVisible' ],

‎test/banners/english/components/BannerVar.spec.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import { TrackerStub } from '@test/fixtures/TrackerStub';
1414
import { donationFormFeatures } from '@test/features/forms/MainDonation_UpgradeToYearly_CustomAmount';
1515
import { resetFormModel } from '@test/resetFormModel';
1616
import { useFormModel } from '@src/components/composables/useFormModel';
17+
import { bannerMainFeatures } from '@test/features/MainBanner';
1718

1819
const formModel = useFormModel();
1920
const translator = ( key: string ): string => key;
@@ -46,6 +47,14 @@ describe( 'BannerVar.vue', () => {
4647
} );
4748
};
4849

50+
describe( 'Main Banner', () => {
51+
test.each( [
52+
[ 'expectDoesNotEmitCloseEvent' ]
53+
] )( '%s', async ( testName: string ) => {
54+
await bannerMainFeatures[ testName ]( getWrapper() );
55+
} );
56+
} );
57+
4958
describe( 'Content', () => {
5059
test.each( [
5160
[ 'expectSlideShowPlaysWhenBecomesVisible' ],

‎test/banners/mobile/components/BannerCtrl.spec.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ import { useFormModel } from '@src/components/composables/useFormModel';
1616
import { resetFormModel } from '@test/resetFormModel';
1717
import { DynamicContent } from '@src/utils/DynamicContent/DynamicContent';
1818
import { bannerContentAnimatedTextFeatures } from '@test/features/BannerContent';
19+
import { fullPageBannerFeatures } from '@test/features/FullPageBanner';
1920

2021
let pageScroller: PageScroller;
2122
const formModel = useFormModel();
@@ -130,4 +131,12 @@ describe( 'BannerCtrl.vue', () => {
130131
} );
131132
} );
132133

134+
describe( 'Full Page Banner', () => {
135+
test.each( [
136+
[ 'expectEmitsCloseEvent' ]
137+
] )( '%s', async ( testName: string ) => {
138+
await fullPageBannerFeatures[ testName ]( getWrapper() );
139+
} );
140+
} );
141+
133142
} );

‎test/banners/mobile_english/components/BannerCtrl.spec.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ import { Intervals } from '@src/utils/FormItemsBuilder/fields/Intervals';
1616
import { PaymentMethods } from '@src/utils/FormItemsBuilder/fields/PaymentMethods';
1717
import { resetFormModel } from '@test/resetFormModel';
1818
import { useFormModel } from '@src/components/composables/useFormModel';
19+
import { fullPageBannerFeatures } from '@test/features/FullPageBanner';
1920

2021
let pageScroller: PageScroller;
2122
const formModel = useFormModel();
@@ -100,4 +101,12 @@ describe( 'BannerCtrl.vue', () => {
100101
} );
101102
} );
102103

104+
describe( 'Full Page Banner', () => {
105+
test.each( [
106+
[ 'expectEmitsCloseEvent' ]
107+
] )( '%s', async ( testName: string ) => {
108+
await fullPageBannerFeatures[ testName ]( wrapper );
109+
} );
110+
} );
111+
103112
} );

‎test/banners/mobile_english/components/BannerVar.spec.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ import { Intervals } from '@src/utils/FormItemsBuilder/fields/Intervals';
1616
import { PaymentMethods } from '@src/utils/FormItemsBuilder/fields/PaymentMethods';
1717
import { useFormModel } from '@src/components/composables/useFormModel';
1818
import { resetFormModel } from '@test/resetFormModel';
19+
import { fullPageBannerFeatures } from '@test/features/FullPageBanner';
1920

2021
let pageScroller: PageScroller;
2122
const formModel = useFormModel();
@@ -100,4 +101,12 @@ describe( 'BannerVar.vue', () => {
100101
} );
101102
} );
102103

104+
describe( 'Full Page Banner', () => {
105+
test.each( [
106+
[ 'expectEmitsCloseEvent' ]
107+
] )( '%s', async ( testName: string ) => {
108+
await fullPageBannerFeatures[ testName ]( wrapper );
109+
} );
110+
} );
111+
103112
} );

‎test/banners/pad/components/BannerCtrl.spec.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ import { donationFormFeatures } from '@test/features/forms/MainDonation_UpgradeT
1515
import { useFormModel } from '@src/components/composables/useFormModel';
1616
import { resetFormModel } from '@test/resetFormModel';
1717
import { DynamicContent } from '@src/utils/DynamicContent/DynamicContent';
18+
import { bannerMainFeatures } from '@test/features/MainBanner';
1819

1920
const formModel = useFormModel();
2021
const translator = ( key: string ): string => key;
@@ -57,6 +58,14 @@ describe( 'BannerCtrl.vue', () => {
5758
wrapper.unmount();
5859
} );
5960

61+
describe( 'Main Banner', () => {
62+
test.each( [
63+
[ 'expectDoesNotEmitCloseEvent' ]
64+
] )( '%s', async ( testName: string ) => {
65+
await bannerMainFeatures[ testName ]( getWrapper() );
66+
} );
67+
} );
68+
6069
describe( 'Content', () => {
6170
test.each( [
6271
[ 'expectSlideShowPlaysWhenBecomesVisible' ],

‎test/banners/pad/components/BannerVar.spec.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ import { resetFormModel } from '@test/resetFormModel';
1515
import { useFormModel } from '@src/components/composables/useFormModel';
1616
import { donationFormFeatures } from '@test/features/forms/MainDonation_UpgradeToYearlyButton';
1717
import { DynamicContent } from '@src/utils/DynamicContent/DynamicContent';
18+
import { bannerMainFeatures } from '@test/features/MainBanner';
1819

1920
const formModel = useFormModel();
2021
const translator = ( key: string ): string => key;
@@ -56,6 +57,14 @@ describe( 'BannerVar.vue', () => {
5657
wrapper.unmount();
5758
} );
5859

60+
describe( 'Main Banner', () => {
61+
test.each( [
62+
[ 'expectDoesNotEmitCloseEvent' ]
63+
] )( '%s', async ( testName: string ) => {
64+
await bannerMainFeatures[ testName ]( getWrapper() );
65+
} );
66+
} );
67+
5968
describe( 'Content', () => {
6069
test.each( [
6170
[ 'expectSlideShowPlaysWhenBecomesVisible' ],

‎test/banners/pad_english/components/BannerVar.spec.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import { donationFormFeatures } from '@test/features/forms/MainDonation_UpgradeT
1313
import { useFormModel } from '@src/components/composables/useFormModel';
1414
import { resetFormModel } from '@test/resetFormModel';
1515
import { softCloseFeatures } from '@test/features/SoftCloseDesktop';
16+
import { bannerMainFeatures } from '@test/features/MainBanner';
1617

1718
const formModel = useFormModel();
1819
const translator = ( key: string ): string => key;
@@ -50,6 +51,14 @@ describe( 'BannerVar.vue', () => {
5051
wrapper.unmount();
5152
} );
5253

54+
describe( 'Main Banner', () => {
55+
test.each( [
56+
[ 'expectDoesNotEmitCloseEvent' ]
57+
] )( '%s', async ( testName: string ) => {
58+
await bannerMainFeatures[ testName ]( wrapper );
59+
} );
60+
} );
61+
5362
describe( 'Content', () => {
5463
test.each( [
5564
[ 'expectSlideShowPlaysWhenBecomesVisible' ],

‎test/banners/wpde_mobile/components/BannerCtrl.spec.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ import { useFormModel } from '@src/components/composables/useFormModel';
1616
import { resetFormModel } from '@test/resetFormModel';
1717
import { DynamicContent } from '@src/utils/DynamicContent/DynamicContent';
1818
import { bannerContentAnimatedTextFeatures } from '@test/features/BannerContent';
19+
import { fullPageBannerFeatures } from '@test/features/FullPageBanner';
1920

2021
let pageScroller: PageScroller;
2122
const formModel = useFormModel();
@@ -129,4 +130,12 @@ describe( 'BannerCtrl.vue', () => {
129130
} );
130131
} );
131132

133+
describe( 'Full Page Banner', () => {
134+
test.each( [
135+
[ 'expectEmitsCloseEvent' ]
136+
] )( '%s', async ( testName: string ) => {
137+
await fullPageBannerFeatures[ testName ]( getWrapper() );
138+
} );
139+
} );
140+
132141
} );

‎test/features/FullPageBanner.ts

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { VueWrapper } from '@vue/test-utils';
2+
import { expect } from 'vitest';
3+
import { CloseEvent } from '@src/tracking/events/CloseEvent';
4+
import { CloseChoices } from '@src/domain/CloseChoices';
5+
6+
const expectEmitsCloseEvent = async ( wrapper: VueWrapper<any> ): Promise<any> => {
7+
await wrapper.find( '.wmde-banner-mini-button' ).trigger( 'click' );
8+
await wrapper.find( '.wmde-banner-full-close' ).trigger( 'click' );
9+
10+
expect( wrapper.emitted( 'bannerClosed' ).length ).toBe( 1 );
11+
expect( wrapper.emitted( 'bannerClosed' )[ 0 ][ 0 ] ).toEqual( new CloseEvent( 'FullPageBanner', CloseChoices.Hide ) );
12+
};
13+
14+
export const fullPageBannerFeatures: Record<string, ( wrapper: VueWrapper<any> ) => Promise<any>> = {
15+
expectEmitsCloseEvent
16+
};

‎test/features/MainBanner.ts

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,13 @@ const expectEmitsCloseEvent = async ( wrapper: VueWrapper<any> ): Promise<any> =
1010
expect( wrapper.emitted( 'bannerClosed' )[ 0 ][ 0 ] ).toEqual( new CloseEvent( 'MainBanner', CloseChoices.Close ) );
1111
};
1212

13+
const expectDoesNotEmitCloseEvent = async ( wrapper: VueWrapper<any> ): Promise<any> => {
14+
await wrapper.find( '.wmde-banner-main .wmde-banner-close' ).trigger( 'click' );
15+
16+
expect( wrapper.emitted( 'bannerClosed' ) ).toBeUndefined();
17+
};
18+
1319
export const bannerMainFeatures: Record<string, ( wrapper: VueWrapper<any> ) => Promise<any>> = {
14-
expectEmitsCloseEvent
20+
expectEmitsCloseEvent,
21+
expectDoesNotEmitCloseEvent
1522
};

‎test/features/SoftCloseMobile.ts

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15,10 +15,7 @@ const expectDoesNotShowSoftCloseOnFullBannerClose = async ( wrapper: VueWrapper<
1515
await wrapper.find( '.wmde-banner-mini-button' ).trigger( 'click' );
1616
await wrapper.find( '.wmde-banner-full-close' ).trigger( 'click' );
1717

18-
expect( wrapper.classes() ).toContain( 'wmde-banner-wrapper--full-page' );
1918
expect( wrapper.find( '.wmde-banner-soft-close' ).exists() ).toBeFalsy();
20-
expect( wrapper.emitted( 'bannerClosed' ).length ).toBe( 1 );
21-
expect( wrapper.emitted( 'bannerClosed' )[ 0 ][ 0 ] ).toEqual( new CloseEvent( 'FullPageBanner', CloseChoices.Close ) );
2219
};
2320

2421
const expectEmitsSoftCloseCloseEvent = async ( wrapper: VueWrapper<any> ): Promise<any> => {

‎test/integration/page/PageOrg.spec.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -100,6 +100,14 @@ describe( 'PageOrg', function () {
100100
expect( mediaWiki.preventBannerDisplayUntilEndOfCampaign ).not.toHaveBeenCalledOnce();
101101
} );
102102

103+
it( 'does not store cookie for the "Hide" event', () => {
104+
const page = new PageWPORG( mediaWiki, new SkinStub(), new SizeIssueCheckerStub() );
105+
106+
page.setCloseCookieIfNecessary( new CloseEvent( 'FullPageBanner', CloseChoices.Hide ) );
107+
108+
expect( mediaWiki.preventBannerDisplayUntilEndOfCampaign ).not.toHaveBeenCalledOnce();
109+
} );
110+
103111
it( 'stores close cookie when user closes soft close', () => {
104112
const page = new PageWPORG( mediaWiki, new SkinStub(), new SizeIssueCheckerStub() );
105113

0 commit comments

Comments
 (0)