chore(tests): update tests and add e2e to ci (#19637)
- increase timeout to fix failing tests
This commit is contained in:
parent
32b97582cb
commit
981cb5674b
|
@ -181,6 +181,16 @@ jobs:
|
|||
command: npm run lint
|
||||
working_directory: /tmp/workspace/core
|
||||
|
||||
test-core-e2e:
|
||||
<<: *defaults
|
||||
steps:
|
||||
- checkout
|
||||
- attach_workspace:
|
||||
at: /tmp/workspace
|
||||
- run:
|
||||
command: npm run test.e2e --ci
|
||||
working_directory: /tmp/workspace/core
|
||||
|
||||
test-core-spec:
|
||||
<<: *defaults
|
||||
steps:
|
||||
|
@ -318,6 +328,8 @@ workflows:
|
|||
requires: [build-core]
|
||||
- test-core-lint:
|
||||
requires: [build-core]
|
||||
- test-core-e2e:
|
||||
requires: [build-core]
|
||||
- test-core-spec:
|
||||
requires: [build-core]
|
||||
- test-core-treeshake:
|
||||
|
|
|
@ -23,7 +23,7 @@ exports.config = {
|
|||
framework: 'jasmine',
|
||||
jasmineNodeOpts: {
|
||||
showColors: true,
|
||||
defaultTimeoutInterval: 30000,
|
||||
defaultTimeoutInterval: 50000,
|
||||
print: function() {}
|
||||
},
|
||||
onPrepare() {
|
||||
|
|
|
@ -7,7 +7,8 @@ test('footer: translucent', async () => {
|
|||
url: '/src/components/footer/test/translucent?ionic:_testing=true'
|
||||
});
|
||||
|
||||
await checkComponentModeClasses(await page.find('ion-footer'), 'footer-translucent');
|
||||
const globalMode = await page.evaluate(() => document.documentElement.getAttribute('mode'));
|
||||
await checkComponentModeClasses(await page.find('ion-footer'), globalMode!, 'footer-translucent');
|
||||
|
||||
const compare = await page.compareScreenshot();
|
||||
expect(compare).toMatchScreenshot();
|
||||
|
|
|
@ -7,7 +7,8 @@ test('header: translucent', async () => {
|
|||
url: '/src/components/header/test/translucent?ionic:_testing=true'
|
||||
});
|
||||
|
||||
await checkComponentModeClasses(await page.find('ion-header'), 'header-translucent');
|
||||
const globalMode = await page.evaluate(() => document.documentElement.getAttribute('mode'));
|
||||
await checkComponentModeClasses(await page.find('ion-header'), globalMode!, 'header-translucent');
|
||||
|
||||
const compare = await page.compareScreenshot();
|
||||
expect(compare).toMatchScreenshot();
|
||||
|
|
|
@ -2,10 +2,6 @@ import { testToast } from '../test.utils';
|
|||
|
||||
const DIRECTORY = 'buttons';
|
||||
|
||||
test('toast: buttons, close property', async () => {
|
||||
await testToast(DIRECTORY, '#closeProp');
|
||||
});
|
||||
|
||||
test('toast: buttons, close array', async () => {
|
||||
await testToast(DIRECTORY, '#closeArray');
|
||||
});
|
||||
|
@ -26,10 +22,6 @@ test('toast: buttons, long button', async () => {
|
|||
* RTL Tests
|
||||
*/
|
||||
|
||||
test('toast:rtl: buttons, close property', async () => {
|
||||
await testToast(DIRECTORY, '#closeProp', true);
|
||||
});
|
||||
|
||||
test('toast:rtl: buttons, close array', async () => {
|
||||
await testToast(DIRECTORY, '#closeArray', true);
|
||||
});
|
||||
|
|
|
@ -40,9 +40,10 @@ test('component: modes', async () => {
|
|||
// e.g. <ion-card-content class="card-content-md">
|
||||
tags = ['ion-card-content', 'ion-footer', 'ion-header', 'ion-infinite-scroll-content', 'ion-item-group', 'ion-item-options', 'ion-list', 'ion-picker', 'ion-refresher', 'ion-slides', 'ion-split-pane'];
|
||||
|
||||
const globalMode = await page.evaluate(() => document.documentElement.getAttribute('mode'));
|
||||
for (const tag of tags) {
|
||||
const el = await page.find(tag);
|
||||
await checkComponentModeClasses(el);
|
||||
await checkComponentModeClasses(el, globalMode!);
|
||||
}
|
||||
|
||||
// Fourth test: .{mode} class
|
||||
|
@ -52,7 +53,6 @@ test('component: modes', async () => {
|
|||
// e.g. <ion-badge class="md">
|
||||
tags = ['ion-action-sheet', 'ion-alert', 'ion-app', 'ion-avatar', 'ion-back-button', 'ion-backdrop', 'ion-badge', 'ion-button', 'ion-buttons', 'ion-card-content', 'ion-card-header', 'ion-card-subtitle', 'ion-card-title', 'ion-card', 'ion-checkbox', 'ion-chip', 'ion-col', 'ion-content', 'ion-datetime', 'ion-fab', 'ion-fab-button', 'ion-fab-list', 'ion-footer', 'ion-grid', 'ion-header', 'ion-icon', 'ion-img', 'ion-infinite-scroll', 'ion-infinite-scroll-content', 'ion-input', 'ion-item', 'ion-item-divider', 'ion-item-group', 'ion-item-option', 'ion-item-options', 'ion-item-sliding', 'ion-label', 'ion-list', 'ion-list-header', 'ion-loading', 'ion-modal', 'ion-menu', 'ion-menu-button', 'ion-menu-toggle', 'ion-note', 'ion-picker', 'ion-picker-column', 'ion-popover', 'ion-progress-bar', 'ion-radio', 'ion-radio-group', 'ion-range', 'ion-refresher', 'ion-refresher-content', 'ion-reorder', 'ion-reorder-group', 'ion-ripple-effect', 'ion-router-link', 'ion-row', 'ion-searchbar', 'ion-segment', 'ion-segment-button', 'ion-select', 'ion-select-option', 'ion-select-popover', 'ion-skeleton-text', 'ion-slide', 'ion-slides', 'ion-spinner', 'ion-split-pane', 'ion-tab-bar', 'ion-tab-button', 'ion-text', 'ion-textarea', 'ion-thumbnail', 'ion-title', 'ion-toast', 'ion-toggle', 'ion-toolbar'];
|
||||
|
||||
const globalMode = await page.evaluate(() => document.documentElement.getAttribute('mode'));
|
||||
for (const tag of tags) {
|
||||
await page.waitForSelector(tag);
|
||||
const el = await page.find(tag);
|
||||
|
|
|
@ -120,20 +120,21 @@ export const queryDeep = async (page: E2EPage, ...selectors: string[]): Promise<
|
|||
*
|
||||
* @param el: E2EElement - The element to verify classes on
|
||||
* @param selector: string - A selector to use instead of the element tag name
|
||||
* @param globalMode: string - the global mode as a fallback
|
||||
*
|
||||
* Examples:
|
||||
* await checkComponentModeClasses(await page.find('ion-card-content'))
|
||||
* await checkComponentModeClasses(await page.find('ion-card-content'), globalMode)
|
||||
* => expect(el).toHaveClass(`card-content-{mode}`);
|
||||
*
|
||||
* await checkComponentModeClasses(await page.find('ion-card-content'), 'some-class')
|
||||
* await checkComponentModeClasses(await page.find('ion-card-content'), globalMode, 'some-class')
|
||||
* => expect(el).toHaveClass(`some-class-{mode}`);
|
||||
*/
|
||||
export const checkComponentModeClasses = async (el: E2EElement, selector?: string) => {
|
||||
export const checkComponentModeClasses = async (el: E2EElement, globalMode: string, selector?: string) => {
|
||||
// If passed a selector to use, use that, else grab the nodeName
|
||||
// of the element and remove the ion prefix to get the class selector
|
||||
const component = selector !== undefined ? selector : el.nodeName.toLowerCase().replace('ion-', '');
|
||||
|
||||
const mode = await el.getProperty('mode');
|
||||
const mode = (await el.getProperty('mode')) || globalMode;
|
||||
|
||||
expect(el).toHaveClass(`${component}-${mode}`);
|
||||
};
|
||||
|
@ -142,6 +143,7 @@ export const checkComponentModeClasses = async (el: E2EElement, selector?: strin
|
|||
* Given an element, get the mode and verify it exists as a class
|
||||
*
|
||||
* @param el: E2EElement - the element to verify the mode class on
|
||||
* @param globalMode: string - the global mode as a fallback
|
||||
*/
|
||||
export const checkModeClasses = async (el: E2EElement, globalMode: string) => {
|
||||
const mode = (await el.getProperty('mode')) || globalMode;
|
||||
|
|
Loading…
Reference in New Issue