Fix sticky header edit icons during A/B test init

- Add test case for T310750

Bug: T310750
Change-Id: Ie52a7227f337dd6cdb0ab441986aa2be6139f949
This commit is contained in:
Jon Robson 2022-06-15 15:01:02 -07:00 committed by Clare Ming
parent ed5de2cd99
commit e1942cec4e
2 changed files with 41 additions and 6 deletions

View file

@ -62,31 +62,38 @@ function initStickyHeaderABTests( abConfig, isStickyHeaderFeatureAllowed, getEna
stickyHeaderExperiment,
noEditIcons = true;
// One of the sticky header AB tests is specified in the config
const abTestName = abConfig.name,
isStickyHeaderExperiment = abTestName === stickyHeader.STICKY_HEADER_EXPERIMENT_NAME ||
abTestName === stickyHeader.STICKY_HEADER_EDIT_EXPERIMENT_NAME;
// Determine if user is eligible for sticky header AB test
if (
isStickyHeaderFeatureAllowed && // The sticky header can be shown on the page
abConfig.enabled && // An AB test config is enabled
( // One of the sticky-header AB tests is specified in the config
abConfig.name === stickyHeader.STICKY_HEADER_EXPERIMENT_NAME ||
abConfig.name === stickyHeader.STICKY_HEADER_EDIT_EXPERIMENT_NAME
)
isStickyHeaderExperiment // The AB test is one of the sticky header experiments
) {
// If eligible, initialize the AB test
stickyHeaderExperiment = getEnabledExperiment( abConfig );
// If running initial AB test, only show sticky header to treatment group.
if ( stickyHeaderExperiment.name === stickyHeader.STICKY_HEADER_EXPERIMENT_NAME ) {
if ( abTestName === stickyHeader.STICKY_HEADER_EXPERIMENT_NAME ) {
show = stickyHeaderExperiment.isInTreatmentBucket();
}
// If running edit-button AB test, show sticky header to all buckets
// and show edit button for treatment group
if ( stickyHeaderExperiment.name === stickyHeader.STICKY_HEADER_EDIT_EXPERIMENT_NAME ) {
if ( abTestName === stickyHeader.STICKY_HEADER_EDIT_EXPERIMENT_NAME ) {
show = true;
if ( stickyHeaderExperiment.isInTreatmentBucket() ) {
noEditIcons = false;
}
}
} else if (
// T310750 Account for when the current experiment is not sticky header or it's disabled.
isStickyHeaderFeatureAllowed && ( !abConfig.enabled || !isStickyHeaderExperiment )
) {
noEditIcons = false;
}
return {

View file

@ -38,6 +38,15 @@ describe( 'main.js', () => {
name: STICKY_HEADER_EDIT_EXPERIMENT_NAME,
enabled: true
};
const DISABLED_STICKY_HEADER_AB_EDIT = {
name: STICKY_HEADER_EDIT_EXPERIMENT_NAME,
enabled: false
};
const TABLE_OF_CONTENTS_AB = {
name: 'skin-vector-toc-experiment',
enabled: true,
buckets: {}
};
[
{
abConfig: STICKY_HEADER_AB_EDIT,
@ -101,11 +110,30 @@ describe( 'main.js', () => {
showStickyHeader: true,
disableEditIcons: true
}
},
{
abConfig: TABLE_OF_CONTENTS_AB,
isEnabled: true,
isUserInTreatmentBucket: false,
expectedResult: {
showStickyHeader: true,
disableEditIcons: false
}
},
{
abConfig: DISABLED_STICKY_HEADER_AB_EDIT,
isEnabled: true,
isUserInTreatmentBucket: false,
expectedResult: {
showStickyHeader: true,
disableEditIcons: false
}
}
].forEach( ( { abConfig, isEnabled, isUserInTreatmentBucket, expectedResult } ) => {
document.documentElement.classList.add( 'vector-sticky-header-enabled' );
const result = test.initStickyHeaderABTests(
abConfig,
// isStickyHeaderFeatureAllowed
isEnabled,
( experiment ) => ( {
name: experiment.name,