Skip to content

Commit

Permalink
[Emoji picker tests TS migration 10/N] Migrate offline tests
Browse files Browse the repository at this point in the history 
Bug: b:270220102
Change-Id: Ic8090303241413bd9a18904198fa87656175b208
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4279662
Reviewed-by: Darren Shen <shend@chromium.org>
Reviewed-by: Mehrab N <mehrab@chromium.org>
Commit-Queue: John Palmer <jopalmer@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1115544}
  • Loading branch information
John Palmer authored and Chromium LUCI CQ committed Mar 10, 2023
1 parent c7cd53f commit e52d668
Show file tree
Hide file tree
Showing 2 changed files with 40 additions and 42 deletions.
2 changes: 1 addition & 1 deletion chrome/test/data/webui/chromeos/emoji_picker/BUILD.gn
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ build_webui_tests("build") {
"emoji_picker_extension_test.js",
"emoji_picker_gif_test.js",
"emoji_picker_http_error_gif_test.js",
"emoji_picker_offline_gif_test.js",
"emoji_picker_offline_gif_test.ts",
"emoji_picker_prefix_search_test.ts",
"emoji_picker_search_gif_test.ts",
"emoji_picker_search_test.ts",
Expand Down
80 changes: 39 additions & 41 deletions ...i_picker/emoji_picker_offline_gif_test.js → ...i_picker/emoji_picker_offline_gif_test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,28 +5,26 @@
import {TRENDING_GROUP_ID} from 'chrome://emoji-picker/constants.js';
import {EmojiPicker} from 'chrome://emoji-picker/emoji_picker.js';
import {EmojiPickerApiProxyImpl} from 'chrome://emoji-picker/emoji_picker_api_proxy.js';
import {EmojiSearch} from 'chrome://emoji-picker/emoji_search.js';
import {EMOJI_PICKER_READY} from 'chrome://emoji-picker/events.js';
import {assert} from 'chrome://resources/ash/common/assert.js';
import {assert} from 'chrome://resources/js/assert_ts.js';
import {flush} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
import {assertEquals} from 'chrome://webui-test/chromeos/chai_assert.js';
import {assertEquals} from 'chrome://webui-test/chai_assert.js';

import {deepQuerySelector, waitForCondition} from './emoji_picker_test_util.js';
import {TestEmojiPickerApiProxyErrorImpl} from './test_emoji_picker_offline_api_proxy.js';

function subcategoryGroupSelector(category, subcategory) {
function subcategoryGroupSelector(category: string, subcategory: string) {
return `[data-group="${subcategory}"] > ` +
`emoji-group[category="${category}"]`;
}

suite('emoji-picker-offline-gif', () => {
/** @type {!EmojiPicker} */
let emojiPicker;
/** @type {function(...!string): ?HTMLElement} */
let findInEmojiPicker;
let emojiSearch;
let emojiPicker: EmojiPicker;
let findInEmojiPicker: (...selectors: string[]) => HTMLElement | null;
let emojiSearch: EmojiSearch;
const categoryList = ['emoji', 'symbol', 'emoticon', 'gif'];
/** @type {number} */
let categoryIndex;
let categoryIndex: number;

setup(() => {
// Reset DOM state.
Expand All @@ -39,76 +37,76 @@ suite('emoji-picker-offline-gif', () => {
EmojiPickerApiProxyImpl.getInstance().isIncognitoTextField = () =>
new Promise((resolve) => resolve({incognito: false}));

EmojiPickerApiProxyImpl.getInstance().setNetError();
(EmojiPickerApiProxyImpl.getInstance() as TestEmojiPickerApiProxyErrorImpl)
.setNetError();

EmojiPicker.configs = () => ({
'dataUrls': {
'emoji': [
dataUrls: {
emoji: [
'/emoji_test_ordering_start.json',
'/emoji_test_ordering_remaining.json',
],
'emoticon': ['/emoticon_test_ordering.json'],
'symbol': ['/symbol_test_ordering.json'],
'gif': [],
emoticon: ['/emoticon_test_ordering.json'],
symbol: ['/symbol_test_ordering.json'],
gif: [],
},
});

emojiPicker =
/** @type {!EmojiPicker} */ (document.createElement('emoji-picker'));
(document.createElement('emoji-picker')) as unknown as EmojiPicker;

findInEmojiPicker = (...path) => deepQuerySelector(emojiPicker, path);

categoryIndex = categoryList.indexOf('gif');

// Wait until emoji data is loaded before executing tests.
return new Promise((resolve) => {
return new Promise<void>((resolve) => {
emojiPicker.addEventListener(EMOJI_PICKER_READY, () => {
flush();
resolve();
});
document.body.appendChild(emojiPicker);
emojiSearch = findInEmojiPicker('emoji-search');
emojiSearch = findInEmojiPicker('emoji-search') as unknown as EmojiSearch;
});
});

test('There is no trending GIFs.', async () => {
const categoryButton =
findInEmojiPicker('emoji-search')
.shadowRoot.querySelectorAll('emoji-category-button')[categoryIndex]
.shadowRoot.querySelector('cr-icon-button');
categoryButton.click();
emojiSearch.shadowRoot!
.querySelectorAll('emoji-category-button')[categoryIndex]!
.shadowRoot!.querySelector('cr-icon-button');
categoryButton!.click();
flush();

// Wait for correct activeInfiniteGroupId to be set.
await waitForCondition(
() => emojiPicker.activeInfiniteGroupId === TRENDING_GROUP_ID);
() => emojiPicker.activeInfiniteGroupId === TRENDING_GROUP_ID,
'wait for correct groupID');

const gifResults = findInEmojiPicker(
subcategoryGroupSelector('gif', emojiPicker.activeInfiniteGroupId));
subcategoryGroupSelector('gif', emojiPicker.activeInfiniteGroupId!));
assert(!gifResults);
});

test(
'There exists emoji-error component in the Trending category.',
async () => {
const categoryButton =
findInEmojiPicker('emoji-search')
.shadowRoot
.querySelectorAll('emoji-category-button')[categoryIndex]
.shadowRoot.querySelector('cr-icon-button');
categoryButton.click();
emojiSearch.shadowRoot!
.querySelectorAll('emoji-category-button')[categoryIndex]!
.shadowRoot!.querySelector('cr-icon-button');
categoryButton!.click();
flush();

const errorElement =
findInEmojiPicker('#list-container', '#groups', 'emoji-error');
findInEmojiPicker('#list-container', '#groups', 'emoji-error')!;
assert(errorElement);

assert(errorElement.shadowRoot.querySelector(
assert(errorElement.shadowRoot!.querySelector(
'.gif-error-container > #no-internet-icon'));
const errorText = errorElement.shadowRoot.querySelector(
const errorText = errorElement.shadowRoot!.querySelector(
'.gif-error-container > .error-text');
assertEquals(
errorText.textContent, 'Connect to the internet to view GIFs');
errorText!.textContent, 'Connect to the internet to view GIFs');
});

test(
Expand All @@ -117,17 +115,17 @@ suite('emoji-picker-offline-gif', () => {
async () => {
emojiSearch.setSearchQuery('abc');
const results = await waitForCondition(
() => findInEmojiPicker('emoji-search')
.shadowRoot.getElementById('results'));
const errorElement = results.querySelector('.no-result > emoji-error');
() => emojiSearch.shadowRoot!.getElementById('results'),
'wait for results');
const errorElement = results!.querySelector('.no-result > emoji-error');
assert(errorElement);

assert(errorElement.shadowRoot.querySelector(
assert(errorElement!.shadowRoot!.querySelector(
'.gif-error-container > #no-internet-icon'));
const errorText = errorElement.shadowRoot.querySelector(
const errorText = errorElement!.shadowRoot!.querySelector(
'.gif-error-container > .error-text');
assertEquals(
errorText.textContent,
errorText!.textContent,
'Connect to the internet to search for GIFs');
});
});

0 comments on commit e52d668

Please sign in to comment.