javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/main' into chore-sync-next-with-main

Browse Source
This commit is contained in:
Maria Hutt
2025-11-26 13:51:27 -08:00
parent 0985187a5c 87e50ad9da
commit b6df59a02c
41 changed files with 666 additions and 847 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
core/scripts/testing/scripts.js
View File

@@ -1,30 +1,73 @@
/**
* This script is loaded in testing environments to set up the
* document based on URL parameters.
*
* Test pages (e.g., `chip/test/basic/index.html`) are set to use
* URL query parameters.
*
* Playwright test environments (e.g., `chip/test/basic/chip.e2e.ts`)
* are set based on whether `setContent` or `goto` has been used:
* - `setContent` uses URL hash parameters. Tests will break if
* query parameters are used.
* - `goto` uses URL query parameters.
*
* The following URL parameters are supported:
* - `rtl`: Set to `true` to enable right-to-left directionality.
* - `ionic:_testing`: Set to `true` to identify testing environments.
* - `ionic:mode`: Set to `ios` or `md` to load a specific mode.
* Defaults to `md`.
* - `palette`: Set to `light`, `dark`, `high-contrast`, or
* `high-contrast-dark` to load a specific palette. Defaults to `light`.
*/
(function() {
if (window.location.search.indexOf('rtl=true') > -1) {
/**
* The `rtl` param is used to set the directionality of the
* document. This can be `true` or `false`.
*/
const isRTL = window.location.search.indexOf('rtl=true') > -1 || window.location.hash.indexOf('rtl=true') > -1;
if (isRTL) {
document.documentElement.setAttribute('dir', 'rtl');
}
if (window.location.search.indexOf('ionic:_testing=true') > -1) {
/**
* The `ionic:_testing` param is used to identify testing
* environments.
*/
const isTestEnv = window.location.search.indexOf('ionic:_testing=true') > -1 || window.location.hash.indexOf('ionic:_testing=true') > -1;
if (isTestEnv) {
const style = document.createElement('style');
style.innerHTML = `
* {
caret-color: transparent !important;
}`;
* {
caret-color: transparent !important;
}
`;
document.head.appendChild(style);
}
/**
* The term `palette` is used to as a param to match the
* Ionic docs, plus here is already a `ionic:theme` query being
* used for `md`, `ios`, and `ionic` themes.
* The `palette` param is used to load a specific palette
* for the theme.
* The dark class will load the dark palette automatically
* if no palette is specified through the URL.
*
* Values can be `light`, `dark`, `high-contrast`,
* or `high-contrast-dark`. Default to `light` for tests.
*/
const palette = window.location.search.match(/palette=([a-z]+)/);
if (palette && palette[1] !== 'light') {
const paletteQuery = window.location.search.match(/palette=([a-z]+)/);
const paletteHash = window.location.hash.match(/palette=([a-z]+)/);
const darkClass = document.body?.classList.contains('ion-palette-dark') ? 'dark' : null;
const paletteName = paletteQuery?.[1] || paletteHash?.[1] || darkClass || 'light';
if (paletteName !== 'light') {
const linkTag = document.createElement('link');
linkTag.setAttribute('rel', 'stylesheet');
linkTag.setAttribute('type', 'text/css');
linkTag.setAttribute('href', `/css/palettes/${palette[1]}.always.css`);
linkTag.setAttribute('href', `/css/palettes/${paletteName}.always.css`);
document.head.appendChild(linkTag);
}