Skip to content

Commit

Permalink
TabSearch: Migrate tests to TypeScript, part 3.
Browse files Browse the repository at this point in the history
 - Migrating all remaining test files.
 - Removing "allowJs: true" from tsconfig_base.json.
 - Leveraging createTab(), createProfileData() helpers to simplify
   sample data creation.
 - Deleting initProfileDataWithDefaults() and sampleData(), no longer
   needed.
 - Removing left-over Closure annotations.

Fixed: 1260300
Change-Id: Icaf4627c41a1e034d334f688ae34a6744e4e9210
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3323905
Auto-Submit: Demetrios Papadopoulos <dpapad@chromium.org>
Reviewed-by: Roman Arora <romanarora@chromium.org>
Commit-Queue: Roman Arora <romanarora@chromium.org>
Cr-Commit-Position: refs/heads/main@{#950135}
  • Loading branch information
freshp86 authored and Chromium LUCI CQ committed Dec 9, 2021
1 parent 719410e commit 40851b2
Show file tree
Hide file tree
Showing 13 changed files with 368 additions and 553 deletions.
6 changes: 6 additions & 0 deletions chrome/browser/resources/tab_search/app.ts
Expand Up @@ -653,4 +653,10 @@ export class TabSearchAppElement extends PolymerElement {
}
}

declare global {
interface HTMLElementTagNameMap {
'tab-search-app': TabSearchAppElement;
}
}

customElements.define(TabSearchAppElement.is, TabSearchAppElement);
6 changes: 6 additions & 0 deletions chrome/browser/resources/tab_search/infinite_list.ts
Expand Up @@ -600,4 +600,10 @@ export class InfiniteList extends PolymerElement {
}
}

declare global {
interface HTMLElementTagNameMap {
'infinite-list': InfiniteList;
}
}

customElements.define(InfiniteList.is, InfiniteList);
6 changes: 6 additions & 0 deletions chrome/browser/resources/tab_search/tab_search_group_item.ts
Expand Up @@ -67,4 +67,10 @@ export class TabSearchGroupItem extends TabSearchGroupItemBase {
}
}

declare global {
interface HTMLElementTagNameMap {
'tab-search-group-item': TabSearchGroupItem;
}
}

customElements.define(TabSearchGroupItem.is, TabSearchGroupItem);
6 changes: 6 additions & 0 deletions chrome/browser/resources/tab_search/tab_search_item.ts
Expand Up @@ -174,4 +174,10 @@ export class TabSearchItem extends TabSearchItemBase {
}
}

declare global {
interface HTMLElementTagNameMap {
'tab-search-item': TabSearchItem;
}
}

customElements.define(TabSearchItem.is, TabSearchItem);
8 changes: 4 additions & 4 deletions chrome/test/data/webui/tab_search/BUILD.gn
Expand Up @@ -29,10 +29,10 @@ ts_library("build_ts") {
in_files = [
"bimap_test.ts",
"fuzzy_search_test.ts",
"infinite_list_test.js",
"tab_search_app_focus_test.js",
"tab_search_app_test.js",
"tab_search_item_test.js",
"infinite_list_test.ts",
"tab_search_app_focus_test.ts",
"tab_search_app_test.ts",
"tab_search_item_test.ts",
"tab_search_test_data.ts",
"tab_search_test_helper.ts",
"test_tab_search_api_proxy.ts",
Expand Down
25 changes: 3 additions & 22 deletions chrome/test/data/webui/tab_search/fuzzy_search_test.ts
Expand Up @@ -4,9 +4,11 @@

import 'chrome://webui-test/mojo_webui_test_support.js';

import {fuzzySearch, FuzzySearchOptions, Tab, TabData, TabGroup, TabItemType} from 'chrome://tab-search.top-chrome/tab_search.js';
import {fuzzySearch, FuzzySearchOptions, TabData, TabGroup, TabItemType} from 'chrome://tab-search.top-chrome/tab_search.js';
import {assertDeepEquals, assertEquals} from 'chrome://webui-test/chai_assert.js';

import {createTab} from './tab_search_test_data.js';

/**
* Assert search results return in specific order.
*/
Expand Down Expand Up @@ -36,27 +38,6 @@ function assertResults(expectedRecords: Array<any>, actualRecords: TabData[]) {
});
}

function createTab(overrides: Partial<Tab>): Tab {
return Object.assign(
{
active: false,
alertStates: [],
faviconUrl: undefined,
groupId: undefined,
index: 0,
isDefaultFavicon: false,
lastActiveElapsedText: '',
lastActiveTimeTicks: {internalValue: BigInt(5)},
pinned: false,
showIcon: false,
tabId: 1,
title: 'Google',
url: {url: 'https://www.google.com'},

},
overrides);
}

suite('FuzzySearchTest', () => {
test('fuzzySearch', () => {
const records: TabData[] = [
Expand Down
Expand Up @@ -5,7 +5,7 @@
import 'chrome://webui-test/mojo_webui_test_support.js';

import {html, PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
import {InfiniteList, TabData, TabSearchItem, TitleItem} from 'chrome://tab-search.top-chrome/tab_search.js';
import {InfiniteList, TabData, TabItemType, TabSearchItem, TitleItem} from 'chrome://tab-search.top-chrome/tab_search.js';

import {assertEquals, assertGT, assertNotEquals, assertTrue} from 'chrome://webui-test/chai_assert.js';
import {flushTasks, waitAfterNextRender} from 'chrome://webui-test/test_util.js';
Expand All @@ -20,7 +20,6 @@ const SAMPLE_SECTION_CLASS = 'section-title';
class TestApp extends PolymerElement {
static get properties() {
return {
/** @private {number} */
maxHeight_: {
type: Number,
value: SAMPLE_AVAIL_HEIGHT,
Expand All @@ -30,7 +29,7 @@ class TestApp extends PolymerElement {

static get template() {
return html`
<infinite-list id="list" max-height="[[maxHeight_]]">
<infinite-list max-height="[[maxHeight_]]">
<template data-type="TitleItem">
<div class="section-title">[[item.title]]</div>
</template>
Expand All @@ -47,52 +46,33 @@ class TestApp extends PolymerElement {
customElements.define('test-app', TestApp);

suite('InfiniteListTest', () => {
/** @type {!InfiniteList} */
let infiniteList;
let infiniteList: InfiniteList;

disableAnimationBehavior(InfiniteList, 'scrollTo');
disableAnimationBehavior(TabSearchItem, 'scrollIntoView');

/**
* @param {!Array<!TabData>} sampleData
*/
async function setupTest(sampleData) {
async function setupTest(sampleData: Array<TabData|TitleItem>) {
const testApp = document.createElement('test-app');
document.body.innerHTML = '';
document.body.appendChild(testApp);

infiniteList = /** @type {!InfiniteList} */ (
testApp.shadowRoot.querySelector('#list'));
infiniteList = testApp.shadowRoot!.querySelector('infinite-list')!;
infiniteList.items = sampleData;
await flushTasks();
}

/**
* @return {!NodeList<!HTMLElement>}
*/
function queryRows() {
return /** @type {!NodeList<!HTMLElement>} */ (
infiniteList.querySelectorAll('tab-search-item'));
function queryRows(): NodeListOf<HTMLElement> {
return infiniteList.querySelectorAll('tab-search-item');
}

/**
* @param {string} className
* @return {!NodeList<!HTMLElement>}
*/
function queryClassElements(className) {
return /** @type {!NodeList<!HTMLElement>} */ (
infiniteList.querySelectorAll('.' + className));
function queryClassElements(className: string): NodeListOf<HTMLElement> {
return infiniteList.querySelectorAll('.' + className);
}

/**
* @param {!Array<string>} siteNames
* @return {!Array<!TabData>}
*/
function sampleTabItems(siteNames) {
function sampleTabItems(siteNames: string[]): TabData[] {
return generateSampleTabsFromSiteNames(siteNames).map(tab => {
const tabData = {hostname: new URL(tab.url.url).hostname, tab};
Object.setPrototypeOf(tabData, TabData.prototype);
return tabData;
return new TabData(
tab, TabItemType.OPEN_TAB, new URL(tab.url.url).hostname);
});
}

Expand Down Expand Up @@ -184,9 +164,8 @@ suite('InfiniteListTest', () => {
const tabItems = sampleTabItems(sampleSiteNames(10));
await setupTest(tabItems);

const tabsDiv = /** @type {!HTMLElement} */ (infiniteList);
// Assert that the tabs are in a overflowing state.
assertGT(tabsDiv.scrollHeight, tabsDiv.clientHeight);
assertGT(infiniteList.scrollHeight, infiniteList.clientHeight);

infiniteList.selected = 0;
for (let i = 0; i < tabItems.length; i++) {
Expand All @@ -196,17 +175,16 @@ suite('InfiniteListTest', () => {
const selectedIndex = ((i + 1) % tabItems.length);
assertEquals(selectedIndex, infiniteList.selected);
assertTabItemAndNeighborsInViewBounds(
tabsDiv, queryRows(), selectedIndex);
infiniteList, queryRows(), selectedIndex);
}
});

test('NavigateUpShowsPreviousAndFollowingListItems', async () => {
const tabItems = sampleTabItems(sampleSiteNames(10));
await setupTest(tabItems);

const tabsDiv = /** @type {!HTMLElement} */ (infiniteList);
// Assert that the tabs are in a overflowing state.
assertGT(tabsDiv.scrollHeight, tabsDiv.clientHeight);
assertGT(infiniteList.scrollHeight, infiniteList.clientHeight);

infiniteList.selected = 0;
for (let i = tabItems.length; i > 0; i--) {
Expand All @@ -215,7 +193,8 @@ suite('InfiniteListTest', () => {

const selectIndex = (i - 1 + tabItems.length) % tabItems.length;
assertEquals(selectIndex, infiniteList.selected);
assertTabItemAndNeighborsInViewBounds(tabsDiv, queryRows(), selectIndex);
assertTabItemAndNeighborsInViewBounds(
infiniteList, queryRows(), selectIndex);
}
});

Expand Down

0 comments on commit 40851b2

Please sign in to comment.