test/checks-opt-button_test.html - infra/gerrit-plugins/buildbucket - Git at Google

 <!DOCTYPE html>
 <!--
 Copyright 2021 The Chromium Authors. All rights reserved.
 Use of this source code is governed by a BSD-style license that can be
 found in the LICENSE file.
 -->
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>checks-opt-view tests</title>

 <script src="../node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 <script src="../node_modules/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>
 <script src="../node_modules/web-component-tester/browser.js"></script>

 <test-fixture id="basic">
   <template>
     <checks-opt-view></checks-opt-view>
   </template>
 </test-fixture>

 <script type="module">
   import './common-test-setup.js';
   import {assertRejects} from './test-util.js';
   import '../src/main/resources/static/checks-opt-view.js';

   suite('checks-opt-view basic tests', () => {
     let sandbox;
     let element;

     setup(() => {
       element = fixture('basic');
       Object.assign(element, {
         plugin: {
           getServerInfo: () => ({gerrit: {instance_id: 'instance'}}),
           checks: () => ({register: () => {}}),
           registerCustomComponent: () => {},
           hook: () => ({onAttached: () => {}}),
           reporting: () => ({reportInteraction: () => Promise.resolve({})}),
           restApi: () => ({
             get: () => Promise.resolve({_account_id: 123}),
           }),
         },
         getHost: () => 'chromium',
         getRepo: () => 'repo',
       });
       element.optCache.clear();

       sandbox = sinon.sandbox.create();
     });

     teardown(() => {
       sandbox.restore();
     });

     test('init registers checks only once', async () => {
       const registerStub = sandbox.stub();
       element.plugin.checks = () => ({register: registerStub});
       element.readOptCache = () => {
         element.optedIn = true;
         element.optOutPhase = false;
       }

       // connectedCallback calls init. This removes the effect of the first call.
       const statusStub = sinon.stub(element, 'isChecksRegistered');
       statusStub.onFirstCall().returns(false);

       // Register for the first time.
       await element.init();
       sinon.assert.calledOnce(registerStub);
       statusStub.restore();

       // Subsequent calls should not register again.
       await element.init();
       sinon.assert.calledOnce(registerStub);

       element.optedIn = false;
       await element.init();
       sinon.assert.calledOnce(registerStub);
     });

     test('init reports checks usage', async () => {
       const stub = sandbox.stub();
       element.plugin.reporting = () => ({reportInteraction: stub});
       element.readOptCache = () => {
         element.optedIn = false;
         element.optOutPhase = true;
       }

       await element.init();
       assert.deepEqual(stub.getCall(0).args,
         [
           'buildbucket-checks-opt',
           {
             account: 123,
             checksEnabled: false,
             host: 'chromium',
             repo: 'repo',
           },
         ],
       );

       element.readOptCache = () => {
         element.optedIn = true;
         element.optOutPhase = true;
       }
       await element.init();
       assert.deepEqual(stub.getCall(1).args,
         [
           'buildbucket-checks-opt',
           {
             account: 123,
             checksEnabled: true,
             host: 'chromium',
             repo: 'repo',
           },
         ],
       );
     });

     test('handleChecksOptButtonTap toggles opt behavior', () => {
       element.optedIn = false;
       element.handleChecksOptButtonTap();
       assert.strictEqual(element.optCache.read().optedIn, true);

       element.optCache.clear();
       element.optedIn = true;
       element.handleChecksOptButtonTap();
       assert.strictEqual(element.optCache.read().optedIn, false);
     });

     test('computeChecksOptButtonText returns correct opt text', () => {
       assert.strictEqual(element.computeChecksOptButtonText(undefined),
           'Opt-In to the New Results UI');
       assert.strictEqual(element.computeChecksOptButtonText(false),
           'Opt-In to the New Results UI');
       assert.strictEqual(element.computeChecksOptButtonText(true),
           'Opt-Out of the New Results UI');
     });

     test('opt-out enabled, new/opted-out account', async () => {
       let read = element.optCache.read();
       assert.strictEqual(read.optedIn, undefined);
       assert.strictEqual(read.optOutPhase, undefined);

       // The user should be automatically opted in.
       await element.init();
       assert.strictEqual(element.optedIn, true);
       assert.strictEqual(element.optOutPhase, true);
       read = element.optCache.read();
       assert.strictEqual(read.optedIn, true);
       assert.strictEqual(read.optOutPhase, true);
       // The user opts out.
       element.handleChecksOptButtonTap();
       read = element.optCache.read();
       assert.strictEqual(read.optedIn, false);
       assert.strictEqual(read.optOutPhase, true);

       // The user should still be opted out.
       await element.init();
       assert.strictEqual(element.optedIn, false);
       assert.strictEqual(element.optOutPhase, true);
       read = element.optCache.read();
       assert.strictEqual(read.optedIn, false);
       assert.strictEqual(read.optOutPhase, true);
     });

     test('opt-out enabled, already opted-in account', async () => {
       const optFn = element.readOptCache;
       element.readOptCache = () => {
         element.optedIn = true;
         element.optOutPhase = undefined;
       }

       // Nothing should change for the user.
       await element.init();
       assert.strictEqual(element.optedIn, true);
       assert.strictEqual(element.optOutPhase, true);
       let read = element.optCache.read();
       assert.strictEqual(read.optedIn, true);
       assert.strictEqual(read.optOutPhase, true);

       // The user opts out.
       element.readOptCache = optFn;
       element.handleChecksOptButtonTap();
       read = element.optCache.read();
       assert.strictEqual(read.optedIn, false);
       assert.strictEqual(read.optOutPhase, true);

       // The user should still be opted out.
       await element.init();
       assert.strictEqual(element.optedIn, false);
       assert.strictEqual(element.optOutPhase, true);
       read = element.optCache.read();
       assert.strictEqual(read.optedIn, false);
       assert.strictEqual(read.optOutPhase, true);
     });
   });
 </script>
	<!DOCTYPE html>
	<!--
	Copyright 2021 The Chromium Authors. All rights reserved.
	Use of this source code is governed by a BSD-style license that can be
	found in the LICENSE file.
	-->
	<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
	<title>checks-opt-view tests</title>

	<script src="../node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
	<script src="../node_modules/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>
	<script src="../node_modules/web-component-tester/browser.js"></script>

	<test-fixture id="basic">
	<template>
	<checks-opt-view></checks-opt-view>
	</template>
	</test-fixture>

	<script type="module">
	import './common-test-setup.js';
	import {assertRejects} from './test-util.js';
	import '../src/main/resources/static/checks-opt-view.js';

	suite('checks-opt-view basic tests', () => {
	let sandbox;
	let element;

	setup(() => {
	element = fixture('basic');
	Object.assign(element, {
	plugin: {
	getServerInfo: () => ({gerrit: {instance_id: 'instance'}}),
	checks: () => ({register: () => {}}),
	registerCustomComponent: () => {},
	hook: () => ({onAttached: () => {}}),
	reporting: () => ({reportInteraction: () => Promise.resolve({})}),
	restApi: () => ({
	get: () => Promise.resolve({_account_id: 123}),
	}),
	},
	getHost: () => 'chromium',
	getRepo: () => 'repo',
	});
	element.optCache.clear();

	sandbox = sinon.sandbox.create();
	});

	teardown(() => {
	sandbox.restore();
	});

	test('init registers checks only once', async () => {
	const registerStub = sandbox.stub();
	element.plugin.checks = () => ({register: registerStub});
	element.readOptCache = () => {
	element.optedIn = true;
	element.optOutPhase = false;
	}

	// connectedCallback calls init. This removes the effect of the first call.
	const statusStub = sinon.stub(element, 'isChecksRegistered');
	statusStub.onFirstCall().returns(false);

	// Register for the first time.
	await element.init();
	sinon.assert.calledOnce(registerStub);
	statusStub.restore();

	// Subsequent calls should not register again.
	await element.init();
	sinon.assert.calledOnce(registerStub);

	element.optedIn = false;
	await element.init();
	sinon.assert.calledOnce(registerStub);
	});

	test('init reports checks usage', async () => {
	const stub = sandbox.stub();
	element.plugin.reporting = () => ({reportInteraction: stub});
	element.readOptCache = () => {
	element.optedIn = false;
	element.optOutPhase = true;
	}

	await element.init();
	assert.deepEqual(stub.getCall(0).args,
	[
	'buildbucket-checks-opt',
	{
	account: 123,
	checksEnabled: false,
	host: 'chromium',
	repo: 'repo',
	},
	],
	);

	element.readOptCache = () => {
	element.optedIn = true;
	element.optOutPhase = true;
	}
	await element.init();
	assert.deepEqual(stub.getCall(1).args,
	[
	'buildbucket-checks-opt',
	{
	account: 123,
	checksEnabled: true,
	host: 'chromium',
	repo: 'repo',
	},
	],
	);
	});

	test('handleChecksOptButtonTap toggles opt behavior', () => {
	element.optedIn = false;
	element.handleChecksOptButtonTap();
	assert.strictEqual(element.optCache.read().optedIn, true);

	element.optCache.clear();
	element.optedIn = true;
	element.handleChecksOptButtonTap();
	assert.strictEqual(element.optCache.read().optedIn, false);
	});

	test('computeChecksOptButtonText returns correct opt text', () => {
	assert.strictEqual(element.computeChecksOptButtonText(undefined),
	'Opt-In to the New Results UI');
	assert.strictEqual(element.computeChecksOptButtonText(false),
	'Opt-In to the New Results UI');
	assert.strictEqual(element.computeChecksOptButtonText(true),
	'Opt-Out of the New Results UI');
	});

	test('opt-out enabled, new/opted-out account', async () => {
	let read = element.optCache.read();
	assert.strictEqual(read.optedIn, undefined);
	assert.strictEqual(read.optOutPhase, undefined);

	// The user should be automatically opted in.
	await element.init();
	assert.strictEqual(element.optedIn, true);
	assert.strictEqual(element.optOutPhase, true);
	read = element.optCache.read();
	assert.strictEqual(read.optedIn, true);
	assert.strictEqual(read.optOutPhase, true);
	// The user opts out.
	element.handleChecksOptButtonTap();
	read = element.optCache.read();
	assert.strictEqual(read.optedIn, false);
	assert.strictEqual(read.optOutPhase, true);

	// The user should still be opted out.
	await element.init();
	assert.strictEqual(element.optedIn, false);
	assert.strictEqual(element.optOutPhase, true);
	read = element.optCache.read();
	assert.strictEqual(read.optedIn, false);
	assert.strictEqual(read.optOutPhase, true);
	});

	test('opt-out enabled, already opted-in account', async () => {
	const optFn = element.readOptCache;
	element.readOptCache = () => {
	element.optedIn = true;
	element.optOutPhase = undefined;
	}

	// Nothing should change for the user.
	await element.init();
	assert.strictEqual(element.optedIn, true);
	assert.strictEqual(element.optOutPhase, true);
	let read = element.optCache.read();
	assert.strictEqual(read.optedIn, true);
	assert.strictEqual(read.optOutPhase, true);

	// The user opts out.
	element.readOptCache = optFn;
	element.handleChecksOptButtonTap();
	read = element.optCache.read();
	assert.strictEqual(read.optedIn, false);
	assert.strictEqual(read.optOutPhase, true);

	// The user should still be opted out.
	await element.init();
	assert.strictEqual(element.optedIn, false);
	assert.strictEqual(element.optOutPhase, true);
	read = element.optCache.read();
	assert.strictEqual(read.optedIn, false);
	assert.strictEqual(read.optOutPhase, true);
	});
	});
	</script>