mirror of
https://github.com/Choices-js/Choices.git
synced 2026-03-14 14:45:47 +01:00
Fix remote data e2e test
This commit is contained in:
parent
7dc8bd168c
commit
00a328196b
6 changed files with 23 additions and 34 deletions
|
|
@ -1362,24 +1362,14 @@ class Choices {
|
|||
|
||||
_handleLoadingState(setLoading = true): void {
|
||||
const { config } = this;
|
||||
let placeholderItem = this.itemList.element.querySelector<HTMLElement>(
|
||||
getClassNamesSelector(config.classNames.placeholder),
|
||||
);
|
||||
|
||||
if (setLoading) {
|
||||
this.disable();
|
||||
this.containerOuter.addLoadingState();
|
||||
|
||||
if (this._isSelectOneElement) {
|
||||
if (!placeholderItem) {
|
||||
placeholderItem = this._templates.placeholder(config, config.loadingText);
|
||||
|
||||
if (placeholderItem) {
|
||||
this.itemList.append(placeholderItem);
|
||||
}
|
||||
} else {
|
||||
placeholderItem.innerHTML = config.loadingText;
|
||||
}
|
||||
this.itemList.clear();
|
||||
this.itemList.append(this._templates.placeholder(config, config.loadingText));
|
||||
} else {
|
||||
this.input.placeholder = config.loadingText;
|
||||
}
|
||||
|
|
@ -1387,11 +1377,7 @@ class Choices {
|
|||
this.enable();
|
||||
this.containerOuter.removeLoadingState();
|
||||
|
||||
if (this._isSelectOneElement) {
|
||||
if (placeholderItem) {
|
||||
placeholderItem.innerHTML = this._placeholderValue || '';
|
||||
}
|
||||
} else {
|
||||
if (!this._isSelectOneElement) {
|
||||
this.input.placeholder = this._placeholderValue || '';
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -20,11 +20,21 @@ export class SelectTestSuit extends TestSuit {
|
|||
}
|
||||
|
||||
async start(textInput?: string): Promise<void> {
|
||||
await this.page.route('/test/data.json', async (route) => {
|
||||
await this.page.route('**/data.json', async (route) => {
|
||||
await new Promise((f) => {
|
||||
setTimeout(f, 1000);
|
||||
setTimeout(f, 250);
|
||||
});
|
||||
|
||||
const fakeData = [...new Array(10)].map((_, index) => ({
|
||||
label: `Label ${index + 1}`,
|
||||
value: `Value ${index + 1}`,
|
||||
}));
|
||||
|
||||
await route.fulfill({
|
||||
status: 200,
|
||||
contentType: 'application/json',
|
||||
body: JSON.stringify(fakeData),
|
||||
});
|
||||
await route.continue();
|
||||
});
|
||||
|
||||
await super.start(textInput);
|
||||
|
|
|
|||
|
|
@ -1,5 +1,4 @@
|
|||
import { expect, type Locator, type Page } from '@playwright/test';
|
||||
import { sanitise } from '../src/scripts/lib/utils';
|
||||
|
||||
export class TestSuit {
|
||||
readonly testId: string;
|
||||
|
|
@ -48,7 +47,6 @@ export class TestSuit {
|
|||
await this.page.goto(this.url);
|
||||
|
||||
await this.group.scrollIntoViewIfNeeded();
|
||||
await this.advanceClock();
|
||||
|
||||
if (textInput) {
|
||||
await this.typeTextAndEnter(textInput);
|
||||
|
|
@ -122,7 +120,6 @@ export class TestSuit {
|
|||
await this.advanceClock();
|
||||
}
|
||||
|
||||
|
||||
async expectVisibleDropdown(text?: string): Promise<void> {
|
||||
await this.advanceClock();
|
||||
|
||||
|
|
|
|||
|
|
@ -482,15 +482,12 @@ describe(`Choices - select multiple`, () => {
|
|||
const suite = new SelectTestSuit(page, bundle, testUrl, testId);
|
||||
await suite.start();
|
||||
|
||||
const placeholder = suite.itemsWithPlaceholder.first();
|
||||
await expect(placeholder).toHaveClass(/choices__placeholder/);
|
||||
await expect(placeholder).toHaveText('Loading...');
|
||||
await expect(suite.input).toHaveAttribute('placeholder', 'Loading...');
|
||||
|
||||
await jsonLoad;
|
||||
await suite.selectByClick();
|
||||
|
||||
await expect(placeholder).toHaveClass(/choices__placeholder/);
|
||||
await expect(placeholder).toHaveText('I am a placeholder');
|
||||
await expect(suite.input).toHaveAttribute('placeholder', 'I am a placeholder');
|
||||
await expect(suite.selectableChoices).toHaveCount(10);
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -405,15 +405,14 @@ describe(`Choices - select one`, () => {
|
|||
const suite = new SelectTestSuit(page, bundle, testUrl, testId);
|
||||
await suite.start();
|
||||
|
||||
const placeholder = suite.itemsWithPlaceholder.first();
|
||||
await expect(placeholder).toHaveClass(/choices__placeholder/);
|
||||
await expect(placeholder).toHaveText('Loading...');
|
||||
await expect(suite.itemList.first()).toHaveText('Loading...');
|
||||
|
||||
await jsonLoad;
|
||||
await suite.selectByClick();
|
||||
|
||||
await expect(placeholder).toHaveClass(/choices__placeholder/);
|
||||
await expect(placeholder).toHaveText('I am a placeholder');
|
||||
const firstItem = suite.itemsWithPlaceholder.first();
|
||||
await expect(firstItem).toHaveClass(/choices__placeholder/);
|
||||
await expect(firstItem).toHaveText('I am a placeholder');
|
||||
await expect(suite.selectableChoices).toHaveCount(10);
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import { expect } from 'chai';
|
||||
// eslint-disable-next-line import/no-named-default
|
||||
import { default as _templates } from '../../src/scripts/templates';
|
||||
import { strToEl, getClassNames, canUseDom } from '../../src/scripts/lib/utils';
|
||||
import { strToEl, getClassNames } from '../../src/scripts/lib/utils';
|
||||
import { DEFAULT_CLASSNAMES, DEFAULT_CONFIG, Options, ClassNames } from '../../src';
|
||||
import { NoticeTypes, Templates as TemplatesInterface } from '../../src/scripts/interfaces/templates';
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue