Compare commits
24 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
f238b4258c | ||
|
|
eb5396fd56 | ||
|
|
665a24d175 | ||
|
|
829a57e7cf | ||
|
|
0f4cca14dc | ||
|
|
85728b7b35 | ||
|
|
05f857a39c | ||
|
|
7c56eb72b0 | ||
|
|
6beb0be4bd | ||
|
|
e826568c75 | ||
|
|
ea8a5974fa | ||
|
|
4a41983098 | ||
|
|
31a5252081 | ||
|
|
5b07400670 | ||
|
|
617dfe9c9e | ||
|
|
b298c0e015 | ||
|
|
32bc681192 | ||
|
|
c63d07bdd0 | ||
|
|
44e1977e98 | ||
|
|
29d4410aa5 | ||
|
|
1ae42a5c13 | ||
|
|
2007a44a27 | ||
|
|
704765e620 | ||
|
|
4640e046eb |
2
.github/ISSUE_TEMPLATE/bug_report.yml
vendored
@@ -9,7 +9,7 @@ body:
|
||||
label: Prerequisites
|
||||
description: Please ensure you have completed all of the following.
|
||||
options:
|
||||
- label: I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue).
|
||||
- label: I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#creating-an-issue).
|
||||
required: true
|
||||
- label: I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
|
||||
required: true
|
||||
|
||||
2
.github/ISSUE_TEMPLATE/feature_request.yml
vendored
@@ -9,7 +9,7 @@ body:
|
||||
label: Prerequisites
|
||||
description: Please ensure you have completed all of the following.
|
||||
options:
|
||||
- label: I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue).
|
||||
- label: I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#creating-an-issue).
|
||||
required: true
|
||||
- label: I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
|
||||
required: true
|
||||
|
||||
2
.github/workflows/assign-issues.yml
vendored
@@ -11,7 +11,7 @@ jobs:
|
||||
issues: write
|
||||
steps:
|
||||
- name: 'Auto-assign issue'
|
||||
uses: pozil/auto-assign-issue@65947009a243e6b3993edeef4e64df3ca85d760c # v1.14.0
|
||||
uses: pozil/auto-assign-issue@c5bca5027e680b9e8411b826d16947afd8c76b32 # v2.0.0
|
||||
with:
|
||||
assignees: brandyscarney, thetaPC
|
||||
numOfAssignee: 1
|
||||
|
||||
6
.github/workflows/conventional-commit.yml
vendored
@@ -24,3 +24,9 @@ jobs:
|
||||
# within the message.
|
||||
subjectPatternError: |
|
||||
The subject "{subject}" found in the pull request title "{title}" didn't match the configured pattern. Please ensure that the subject doesn't start with an uppercase character.
|
||||
# If the PR contains one of these newline-delimited labels, the
|
||||
# validation is skipped. If you want to rerun the validation when
|
||||
# labels change, you might want to use the `labeled` and `unlabeled`
|
||||
# event triggers in your workflow.
|
||||
ignoreLabels: |
|
||||
release
|
||||
|
||||
34
CHANGELOG.md
@@ -3,6 +3,40 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
# [8.2.0](https://github.com/ionic-team/ionic-framework/compare/v8.1.3...v8.2.0) (2024-05-22)
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* **angular:** setting props on a signal works ([#29453](https://github.com/ionic-team/ionic-framework/issues/29453)) ([4640e04](https://github.com/ionic-team/ionic-framework/commit/4640e046ebbd35bf92737368c6262f79a8803a59)), closes [#28876](https://github.com/ionic-team/ionic-framework/issues/28876)
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## [8.1.3](https://github.com/ionic-team/ionic-framework/compare/v8.1.2...v8.1.3) (2024-05-22)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **core:** malformed URIs will not throw exception ([#29486](https://github.com/ionic-team/ionic-framework/issues/29486)) ([4a41983](https://github.com/ionic-team/ionic-framework/commit/4a41983098fe9bf83fdf05ce7ab28c79f414e11b)), closes [#29479](https://github.com/ionic-team/ionic-framework/issues/29479)
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## [8.1.2](https://github.com/ionic-team/ionic-framework/compare/v8.1.1...v8.1.2) (2024-05-15)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **many:** do not grow slotted checkboxes, radios, selects and toggles ([#29501](https://github.com/ionic-team/ionic-framework/issues/29501)) ([c63d07b](https://github.com/ionic-team/ionic-framework/commit/c63d07bdd0c4d9939474c52b03a3f2535511933f)), closes [#29423](https://github.com/ionic-team/ionic-framework/issues/29423)
|
||||
* **picker:** update keyboard navigation ([#29497](https://github.com/ionic-team/ionic-framework/issues/29497)) ([32bc681](https://github.com/ionic-team/ionic-framework/commit/32bc681192b1833f1c897e692d2d36ba90c6af53))
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## [8.1.1](https://github.com/ionic-team/ionic-framework/compare/v8.1.0...v8.1.1) (2024-05-08)
|
||||
|
||||
|
||||
|
||||
22
README.md
@@ -20,7 +20,7 @@
|
||||
<a href="https://github.com/ionic-team/ionic-framework/blob/main/LICENSE">
|
||||
<img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="Ionic Framework is released under the MIT license." />
|
||||
</a>
|
||||
<a href="https://github.com/ionic-team/ionic/blob/main/docs/CONTRIBUTING.md">
|
||||
<a href="https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md">
|
||||
<img src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg" alt="PRs welcome!" />
|
||||
</a>
|
||||
<a href="https://twitter.com/Ionicframework">
|
||||
@@ -38,7 +38,7 @@
|
||||
Documentation
|
||||
</a>
|
||||
<span> · </span>
|
||||
<a href="https://github.com/ionic-team/ionic/blob/main/docs/CONTRIBUTING.md">Contribute</a>
|
||||
<a href="https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md">Contribute</a>
|
||||
<span> · </span>
|
||||
<a href="https://blog.ionicframework.com/">Blog</a>
|
||||
<br />
|
||||
@@ -63,14 +63,15 @@ Looking for the `ionic-angular` package? Ionic 3 has been moved to the [`ionic-v
|
||||
|
||||
### Getting Started
|
||||
|
||||
Start a new project by following our quick [Getting Started guide](https://ionicframework.com/getting-started/).
|
||||
Start a new project by following our [documentation](https://ionicframework.com/docs/).
|
||||
We would love to hear from you! If you have any feedback or run into issues using our framework, please file
|
||||
an [issue](https://github.com/ionic-team/ionic/issues/new) on this repository.
|
||||
an [issue](https://github.com/ionic-team/ionic-framework/issues/new) on this repository.
|
||||
|
||||
### Migration Guides
|
||||
|
||||
Already have an Ionic app? These guides will help you migrate to the latest versions.
|
||||
|
||||
* [Migrate from v7 to v8](https://ionicframework.com/docs/updating/8-0)
|
||||
* [Migrate from v6 to v7](https://ionicframework.com/docs/updating/7-0)
|
||||
* [Migrate from v5 to v6](https://ionicframework.com/docs/updating/6-0)
|
||||
* [Migrate from v4 to v5](https://ionicframework.com/docs/updating/5-0)
|
||||
@@ -82,21 +83,16 @@ The Ionic Conference App is a full featured Ionic app. It is the perfect startin
|
||||
|
||||
- [Angular Ionic Conference App](https://github.com/ionic-team/ionic-conference-app)
|
||||
- [React Ionic Conference App](https://github.com/ionic-team/ionic-react-conference-app)
|
||||
<!-- TODO(FW-3811): add this when the vue conference app is updated -->
|
||||
<!-- - [Vue Ionic Conference App](https://github.com/ionic-team/ionic-vue-conference-app) -->
|
||||
- [Vue Ionic Conference App](https://github.com/ionic-team/ionic-vue-conference-app)
|
||||
|
||||
### Contributing
|
||||
|
||||
Thanks for your interest in contributing! Read up on our guidelines for
|
||||
[contributing](https://github.com/ionic-team/ionic/blob/main/docs/CONTRIBUTING.md)
|
||||
and then look through our issues with a [help wanted](https://github.com/ionic-team/ionic/issues?q=is%3Aopen+is%3Aissue+label%3A%22help+wanted%22)
|
||||
[contributing](https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md)
|
||||
and then look through our issues with a [help wanted](https://github.com/ionic-team/ionic-framework/issues?q=is%3Aopen+is%3Aissue+label%3A%22help+wanted%22)
|
||||
label.
|
||||
|
||||
Please note that this project is released with a [Contributor Code of Conduct](https://github.com/ionic-team/ionic/blob/main/CODE_OF_CONDUCT.md). By participating in this project you agree to abide by its terms.
|
||||
|
||||
### Future Goals
|
||||
|
||||
As Ionic Framework components migrate to the web component standard, a goal of ours is to have Ionic Framework easily work within all of the popular frameworks.
|
||||
Please note that this project is released with a [Contributor Code of Conduct](https://github.com/ionic-team/ionic-framework/blob/main/CODE_OF_CONDUCT.md). By participating in this project you agree to abide by its terms.
|
||||
|
||||
### Earlier Versions
|
||||
|
||||
|
||||
@@ -3,6 +3,37 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
# [8.2.0](https://github.com/ionic-team/ionic-framework/compare/v8.1.3...v8.2.0) (2024-05-22)
|
||||
|
||||
**Note:** Version bump only for package @ionic/core
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## [8.1.3](https://github.com/ionic-team/ionic-framework/compare/v8.1.2...v8.1.3) (2024-05-22)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **core:** malformed URIs will not throw exception ([#29486](https://github.com/ionic-team/ionic-framework/issues/29486)) ([4a41983](https://github.com/ionic-team/ionic-framework/commit/4a41983098fe9bf83fdf05ce7ab28c79f414e11b)), closes [#29479](https://github.com/ionic-team/ionic-framework/issues/29479)
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## [8.1.2](https://github.com/ionic-team/ionic-framework/compare/v8.1.1...v8.1.2) (2024-05-15)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **many:** do not grow slotted checkboxes, radios, selects and toggles ([#29501](https://github.com/ionic-team/ionic-framework/issues/29501)) ([c63d07b](https://github.com/ionic-team/ionic-framework/commit/c63d07bdd0c4d9939474c52b03a3f2535511933f)), closes [#29423](https://github.com/ionic-team/ionic-framework/issues/29423)
|
||||
* **picker:** update keyboard navigation ([#29497](https://github.com/ionic-team/ionic-framework/issues/29497)) ([32bc681](https://github.com/ionic-team/ionic-framework/commit/32bc681192b1833f1c897e692d2d36ba90c6af53))
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## [8.1.1](https://github.com/ionic-team/ionic-framework/compare/v8.1.0...v8.1.1) (2024-05-08)
|
||||
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
# Get Playwright
|
||||
FROM mcr.microsoft.com/playwright:v1.43.1
|
||||
FROM mcr.microsoft.com/playwright:v1.44.0
|
||||
|
||||
# Set the working directory
|
||||
WORKDIR /ionic
|
||||
|
||||
@@ -96,7 +96,7 @@ const showModal = async () => {
|
||||
|
||||
## How to contribute
|
||||
|
||||
[Check out the CONTRIBUTE guide](/.github/CONTRIBUTING.md)
|
||||
[Check out the CONTRIBUTE guide](/docs/CONTRIBUTING.md)
|
||||
|
||||
## Related
|
||||
|
||||
|
||||
1296
core/api.txt
60
core/package-lock.json
generated
@@ -1,12 +1,12 @@
|
||||
{
|
||||
"name": "@ionic/core",
|
||||
"version": "8.1.1",
|
||||
"version": "8.2.0",
|
||||
"lockfileVersion": 2,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "@ionic/core",
|
||||
"version": "8.1.1",
|
||||
"version": "8.2.0",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@stencil/core": "^4.17.2",
|
||||
@@ -1691,12 +1691,12 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@playwright/test": {
|
||||
"version": "1.43.1",
|
||||
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.43.1.tgz",
|
||||
"integrity": "sha512-HgtQzFgNEEo4TE22K/X7sYTYNqEMMTZmFS8kTq6m8hXj+m1D8TgwgIbumHddJa9h4yl4GkKb8/bgAl2+g7eDgA==",
|
||||
"version": "1.44.0",
|
||||
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.44.0.tgz",
|
||||
"integrity": "sha512-rNX5lbNidamSUorBhB4XZ9SQTjAqfe5M+p37Z8ic0jPFBMo5iCtQz1kRWkEMg+rYOKSlVycpQmpqjSFq7LXOfg==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"playwright": "1.43.1"
|
||||
"playwright": "1.44.0"
|
||||
},
|
||||
"bin": {
|
||||
"playwright": "cli.js"
|
||||
@@ -1786,9 +1786,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@stencil/core": {
|
||||
"version": "4.17.2",
|
||||
"resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.17.2.tgz",
|
||||
"integrity": "sha512-MX7yaLmpTU9iZvCire9nhecTcE0qBlV0vPWrLMeIXewYN7/hb8B3NjnhQyBKC93FDPI8NBRmt6KIugLw9zcRZg==",
|
||||
"version": "4.18.1",
|
||||
"resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.18.1.tgz",
|
||||
"integrity": "sha512-WoRctLuXqoiLquS4EEvMoyLsbQ5+xuk8wp0+n4mYjoAoXy8NppXmMqKrMlFyYXL/zUI5ODS7U7IcLCpZ3IcKZQ==",
|
||||
"bin": {
|
||||
"stencil": "bin/stencil"
|
||||
},
|
||||
@@ -8222,12 +8222,12 @@
|
||||
}
|
||||
},
|
||||
"node_modules/playwright": {
|
||||
"version": "1.43.1",
|
||||
"resolved": "https://registry.npmjs.org/playwright/-/playwright-1.43.1.tgz",
|
||||
"integrity": "sha512-V7SoH0ai2kNt1Md9E3Gwas5B9m8KR2GVvwZnAI6Pg0m3sh7UvgiYhRrhsziCmqMJNouPckiOhk8T+9bSAK0VIA==",
|
||||
"version": "1.44.0",
|
||||
"resolved": "https://registry.npmjs.org/playwright/-/playwright-1.44.0.tgz",
|
||||
"integrity": "sha512-F9b3GUCLQ3Nffrfb6dunPOkE5Mh68tR7zN32L4jCk4FjQamgesGay7/dAAe1WaMEGV04DkdJfcJzjoCKygUaRQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"playwright-core": "1.43.1"
|
||||
"playwright-core": "1.44.0"
|
||||
},
|
||||
"bin": {
|
||||
"playwright": "cli.js"
|
||||
@@ -8240,9 +8240,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/playwright-core": {
|
||||
"version": "1.43.1",
|
||||
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.43.1.tgz",
|
||||
"integrity": "sha512-EI36Mto2Vrx6VF7rm708qSnesVQKbxEWvPrfA1IPY6HgczBplDx7ENtx+K2n4kJ41sLLkuGfmb0ZLSSXlDhqPg==",
|
||||
"version": "1.44.0",
|
||||
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.44.0.tgz",
|
||||
"integrity": "sha512-ZTbkNpFfYcGWohvTTl+xewITm7EOuqIqex0c7dNZ+aXsbrLj0qI8XlGKfPpipjm0Wny/4Lt4CJsWJk1stVS5qQ==",
|
||||
"dev": true,
|
||||
"bin": {
|
||||
"playwright-core": "cli.js"
|
||||
@@ -11443,12 +11443,12 @@
|
||||
}
|
||||
},
|
||||
"@playwright/test": {
|
||||
"version": "1.43.1",
|
||||
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.43.1.tgz",
|
||||
"integrity": "sha512-HgtQzFgNEEo4TE22K/X7sYTYNqEMMTZmFS8kTq6m8hXj+m1D8TgwgIbumHddJa9h4yl4GkKb8/bgAl2+g7eDgA==",
|
||||
"version": "1.44.0",
|
||||
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.44.0.tgz",
|
||||
"integrity": "sha512-rNX5lbNidamSUorBhB4XZ9SQTjAqfe5M+p37Z8ic0jPFBMo5iCtQz1kRWkEMg+rYOKSlVycpQmpqjSFq7LXOfg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"playwright": "1.43.1"
|
||||
"playwright": "1.44.0"
|
||||
}
|
||||
},
|
||||
"@rollup/plugin-node-resolve": {
|
||||
@@ -11516,9 +11516,9 @@
|
||||
"requires": {}
|
||||
},
|
||||
"@stencil/core": {
|
||||
"version": "4.17.2",
|
||||
"resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.17.2.tgz",
|
||||
"integrity": "sha512-MX7yaLmpTU9iZvCire9nhecTcE0qBlV0vPWrLMeIXewYN7/hb8B3NjnhQyBKC93FDPI8NBRmt6KIugLw9zcRZg=="
|
||||
"version": "4.18.1",
|
||||
"resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.18.1.tgz",
|
||||
"integrity": "sha512-WoRctLuXqoiLquS4EEvMoyLsbQ5+xuk8wp0+n4mYjoAoXy8NppXmMqKrMlFyYXL/zUI5ODS7U7IcLCpZ3IcKZQ=="
|
||||
},
|
||||
"@stencil/react-output-target": {
|
||||
"version": "0.5.3",
|
||||
@@ -16167,19 +16167,19 @@
|
||||
}
|
||||
},
|
||||
"playwright": {
|
||||
"version": "1.43.1",
|
||||
"resolved": "https://registry.npmjs.org/playwright/-/playwright-1.43.1.tgz",
|
||||
"integrity": "sha512-V7SoH0ai2kNt1Md9E3Gwas5B9m8KR2GVvwZnAI6Pg0m3sh7UvgiYhRrhsziCmqMJNouPckiOhk8T+9bSAK0VIA==",
|
||||
"version": "1.44.0",
|
||||
"resolved": "https://registry.npmjs.org/playwright/-/playwright-1.44.0.tgz",
|
||||
"integrity": "sha512-F9b3GUCLQ3Nffrfb6dunPOkE5Mh68tR7zN32L4jCk4FjQamgesGay7/dAAe1WaMEGV04DkdJfcJzjoCKygUaRQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"fsevents": "2.3.2",
|
||||
"playwright-core": "1.43.1"
|
||||
"playwright-core": "1.44.0"
|
||||
}
|
||||
},
|
||||
"playwright-core": {
|
||||
"version": "1.43.1",
|
||||
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.43.1.tgz",
|
||||
"integrity": "sha512-EI36Mto2Vrx6VF7rm708qSnesVQKbxEWvPrfA1IPY6HgczBplDx7ENtx+K2n4kJ41sLLkuGfmb0ZLSSXlDhqPg==",
|
||||
"version": "1.44.0",
|
||||
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.44.0.tgz",
|
||||
"integrity": "sha512-ZTbkNpFfYcGWohvTTl+xewITm7EOuqIqex0c7dNZ+aXsbrLj0qI8XlGKfPpipjm0Wny/4Lt4CJsWJk1stVS5qQ==",
|
||||
"dev": true
|
||||
},
|
||||
"postcss": {
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@ionic/core",
|
||||
"version": "8.1.1",
|
||||
"version": "8.2.0",
|
||||
"description": "Base components for Ionic",
|
||||
"keywords": [
|
||||
"ionic",
|
||||
@@ -108,7 +108,7 @@
|
||||
"url": "git+https://github.com/ionic-team/ionic-framework.git"
|
||||
},
|
||||
"bugs": {
|
||||
"url": "https://github.com/ionic-team/ionic/issues"
|
||||
"url": "https://github.com/ionic-team/ionic-framework/issues"
|
||||
},
|
||||
"homepage": "https://ionicframework.com/",
|
||||
"jest": {
|
||||
|
||||
@@ -33,7 +33,7 @@ function generateComponent(component, content) {
|
||||
content.push(`${component.tag},event,${prop.event},${prop.detail},${prop.bubbles}`);
|
||||
});
|
||||
component.styles.forEach(prop => {
|
||||
content.push(`${component.tag},css-prop,${prop.name}`);
|
||||
content.push(`${component.tag},css-prop,${prop.name}${prop.mode ? ',' + prop.mode : ''}`);
|
||||
});
|
||||
component.parts.forEach(part => {
|
||||
content.push(`${component.tag},part,${part.name}`);
|
||||
|
||||
@@ -53,4 +53,7 @@ if (requestHeaded && !hasHeadedConfigFiles) {
|
||||
console.warn(chalk.yellow.bold('\n⚠️ You are running tests in headed mode, but one or more of your headed config files was not found.\nPlease ensure that both docker-display.txt and docker-display-volume.txt have been created in the correct location.\n'));
|
||||
}
|
||||
|
||||
execa('docker', args, { shell: true, stdio: 'inherit' });
|
||||
const res = await execa('docker', args, { shell: true, stdio: 'inherit' });
|
||||
|
||||
// If underlying scripts failed this whole process should fail too
|
||||
process.exit(res.exitCode);
|
||||
|
||||
@@ -3,10 +3,11 @@ import { configs, test } from '@utils/test/playwright';
|
||||
|
||||
configs().forEach(({ config, title }) => {
|
||||
test.describe(title('accordion: a11y'), () => {
|
||||
test('accordions should be keyboard navigable', async ({ page, skip, browserName }) => {
|
||||
// TODO(FW-1764): remove skip once issue is resolved
|
||||
// TODO(ROU-8157): remove skip once the keyboard navigation is working again
|
||||
test.skip('accordions should be keyboard navigable', async ({ page, skip, browserName }) => {
|
||||
// TODO(ROU-5358): remove skip once issue is resolved
|
||||
skip.browser('firefox', 'https://github.com/ionic-team/ionic-framework/issues/25070');
|
||||
// TODO (FW-2979)
|
||||
// TODO (ROU-5437)
|
||||
skip.browser('webkit', 'Safari 16 only allows text fields and pop-up menus to be focused.');
|
||||
|
||||
await page.goto(`/src/components/accordion/test/a11y`, config);
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<html lang="en" dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Accordion - Basic</title>
|
||||
<title>Accordion - Standalone</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0" />
|
||||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet" />
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet" />
|
||||
@@ -119,6 +119,7 @@
|
||||
outline: none;
|
||||
text-align: left;
|
||||
padding: 20px 16px;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.custom-accordion-content {
|
||||
|
||||
@@ -180,7 +180,10 @@ configs({ directions: ['ltr'] }).forEach(({ config, title }) => {
|
||||
*/
|
||||
configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
|
||||
test.describe(title('alert: font scaling'), () => {
|
||||
test('should scale text on larger font sizes', async ({ page }) => {
|
||||
test('should scale text on larger font sizes', async ({ page, skip }) => {
|
||||
// TODO(ROU-8158): unskip this test when a solution is found
|
||||
skip.browser('chromium', 'Rendering is flaky in Chrome.');
|
||||
|
||||
await page.setContent(
|
||||
`
|
||||
<style>
|
||||
|
||||
@@ -11,7 +11,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ config, screenshot, t
|
||||
test('should update the active item', async ({ page }) => {
|
||||
const breadcrumbItems = page.locator('ion-breadcrumb');
|
||||
|
||||
const addItemButton = page.locator('ion-button#add-btn');
|
||||
const addItemButton = page.locator('#add-btn');
|
||||
|
||||
await expect(breadcrumbItems).toHaveCount(4);
|
||||
|
||||
|
||||
@@ -52,6 +52,11 @@
|
||||
*/
|
||||
:host([slot="start"]),
|
||||
:host([slot="end"]) {
|
||||
// Reset the flex property when the checkbox
|
||||
// is slotted to avoid growing the element larger
|
||||
// than its content.
|
||||
flex: initial;
|
||||
|
||||
width: auto;
|
||||
}
|
||||
|
||||
|
||||
|
Before Width: | Height: | Size: 41 KiB After Width: | Height: | Size: 36 KiB |
@@ -7,7 +7,7 @@ configs().forEach(({ title, screenshot, config }) => {
|
||||
await page.goto('/src/components/datetime/test/position', config);
|
||||
const ionPopoverDidPresent = await page.spyOnEvent('ionPopoverDidPresent');
|
||||
|
||||
const openDateTimeBtn = page.locator('ion-button#open-datetime');
|
||||
const openDateTimeBtn = page.locator('#open-datetime');
|
||||
await openDateTimeBtn.click();
|
||||
|
||||
await ionPopoverDidPresent.next();
|
||||
|
||||
|
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 28 KiB |
|
Before Width: | Height: | Size: 39 KiB After Width: | Height: | Size: 39 KiB |
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 28 KiB |
|
Before Width: | Height: | Size: 38 KiB After Width: | Height: | Size: 38 KiB |
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 31 KiB After Width: | Height: | Size: 30 KiB |
|
Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 31 KiB After Width: | Height: | Size: 30 KiB |
|
Before Width: | Height: | Size: 21 KiB After Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 35 KiB After Width: | Height: | Size: 35 KiB |
|
Before Width: | Height: | Size: 48 KiB After Width: | Height: | Size: 47 KiB |
|
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 28 KiB |
|
Before Width: | Height: | Size: 35 KiB After Width: | Height: | Size: 35 KiB |
|
Before Width: | Height: | Size: 46 KiB After Width: | Height: | Size: 46 KiB |
|
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 28 KiB |
|
Before Width: | Height: | Size: 30 KiB After Width: | Height: | Size: 29 KiB |
|
Before Width: | Height: | Size: 39 KiB After Width: | Height: | Size: 36 KiB |
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 30 KiB After Width: | Height: | Size: 29 KiB |
|
Before Width: | Height: | Size: 39 KiB After Width: | Height: | Size: 36 KiB |
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 25 KiB |
@@ -200,3 +200,57 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
/**
|
||||
* This behavior does not vary across directions
|
||||
*/
|
||||
configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
|
||||
test.describe(title('item: inputs'), () => {
|
||||
test('should not shrink the width of a div next to a checkbox, radio, select or toggle', async ({
|
||||
page,
|
||||
}, testInfo) => {
|
||||
testInfo.annotations.push({
|
||||
type: 'issue',
|
||||
description: 'https://github.com/ionic-team/ionic-framework/issues/29319',
|
||||
});
|
||||
await page.setContent(
|
||||
`
|
||||
<style>
|
||||
.box {
|
||||
background: lightgreen;
|
||||
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<ion-list lines="none">
|
||||
<ion-item>
|
||||
<div class="box"></div>
|
||||
<ion-checkbox>Checkbox</ion-checkbox>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<div class="box"></div>
|
||||
<ion-radio>Radio</ion-radio>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<div class="box"></div>
|
||||
<ion-select label="Select">
|
||||
<ion-select-option>Option</ion-select-option>
|
||||
</ion-select>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<div class="box"></div>
|
||||
<ion-toggle>Toggle</ion-toggle>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const list = page.locator('ion-list');
|
||||
|
||||
await expect(list).toHaveScreenshot(screenshot(`item-inputs-div-with-inputs`));
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
|
After Width: | Height: | Size: 8.4 KiB |
|
After Width: | Height: | Size: 9.6 KiB |
|
After Width: | Height: | Size: 7.6 KiB |
|
After Width: | Height: | Size: 7.9 KiB |
|
After Width: | Height: | Size: 9.3 KiB |
|
After Width: | Height: | Size: 6.9 KiB |
@@ -12,3 +12,163 @@ configs().forEach(({ title, screenshot, config }) => {
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
/**
|
||||
* This behavior does not vary across directions
|
||||
*/
|
||||
configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
|
||||
test.describe(title('item: slotted inputs'), () => {
|
||||
test.describe('checkbox', () => {
|
||||
test('should not expand the slotted checkbox width larger than its content', async ({ page }, testInfo) => {
|
||||
testInfo.annotations.push({
|
||||
type: 'issue',
|
||||
description: 'https://github.com/ionic-team/ionic-framework/issues/29423',
|
||||
});
|
||||
|
||||
await page.setContent(
|
||||
`
|
||||
<ion-list>
|
||||
<ion-item>
|
||||
<ion-checkbox slot="start"></ion-checkbox>
|
||||
<ion-label>Label</ion-label>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Label</ion-label>
|
||||
<ion-checkbox slot="end"></ion-checkbox>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-checkbox slot="start">Start</ion-checkbox>
|
||||
<ion-label>Label</ion-label>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Label</ion-label>
|
||||
<ion-checkbox slot="end">End</ion-checkbox>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const list = page.locator('ion-list');
|
||||
|
||||
await expect(list).toHaveScreenshot(screenshot(`item-slotted-inputs-checkbox`));
|
||||
});
|
||||
});
|
||||
test.describe('radio', () => {
|
||||
test('should not expand the slotted radio width larger than its content', async ({ page }, testInfo) => {
|
||||
testInfo.annotations.push({
|
||||
type: 'issue',
|
||||
description: 'https://github.com/ionic-team/ionic-framework/issues/29423',
|
||||
});
|
||||
|
||||
await page.setContent(
|
||||
`
|
||||
<ion-list>
|
||||
<ion-item>
|
||||
<ion-radio slot="start"></ion-radio>
|
||||
<ion-label>Label</ion-label>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Label</ion-label>
|
||||
<ion-radio slot="end"></ion-radio>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-radio slot="start">Start</ion-radio>
|
||||
<ion-label>Label</ion-label>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Label</ion-label>
|
||||
<ion-radio slot="end">End</ion-radio>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const list = page.locator('ion-list');
|
||||
|
||||
await expect(list).toHaveScreenshot(screenshot(`item-slotted-inputs-radio`));
|
||||
});
|
||||
});
|
||||
test.describe('select', () => {
|
||||
test('should not expand the slotted select width larger than its content', async ({ page }, testInfo) => {
|
||||
testInfo.annotations.push({
|
||||
type: 'issue',
|
||||
description: 'https://github.com/ionic-team/ionic-framework/issues/29423',
|
||||
});
|
||||
|
||||
await page.setContent(
|
||||
`
|
||||
<ion-list>
|
||||
<ion-item>
|
||||
<ion-select slot="start">
|
||||
<ion-select-option>Option</ion-select-option>
|
||||
</ion-select>
|
||||
<ion-label>Label</ion-label>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Label</ion-label>
|
||||
<ion-select slot="end">
|
||||
<ion-select-option>Option</ion-select-option>
|
||||
</ion-select>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-select slot="start" label="Start">
|
||||
<ion-select-option>Option</ion-select-option>
|
||||
</ion-select>
|
||||
<ion-label>Label</ion-label>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Label</ion-label>
|
||||
<ion-select slot="end" label="End">
|
||||
<ion-select-option>Option</ion-select-option>
|
||||
</ion-select>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const list = page.locator('ion-list');
|
||||
|
||||
await expect(list).toHaveScreenshot(screenshot(`item-slotted-inputs-select`));
|
||||
});
|
||||
});
|
||||
test.describe('toggle', () => {
|
||||
test('should not expand the slotted toggle width larger than its content', async ({ page }, testInfo) => {
|
||||
testInfo.annotations.push({
|
||||
type: 'issue',
|
||||
description: 'https://github.com/ionic-team/ionic-framework/issues/29423',
|
||||
});
|
||||
|
||||
await page.setContent(
|
||||
`
|
||||
<ion-list>
|
||||
<ion-item>
|
||||
<ion-toggle slot="start"></ion-toggle>
|
||||
<ion-label>Label</ion-label>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Label</ion-label>
|
||||
<ion-toggle slot="end"></ion-toggle>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-toggle slot="start">Start</ion-toggle>
|
||||
<ion-label>Label</ion-label>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Label</ion-label>
|
||||
<ion-toggle slot="end">End</ion-toggle>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const list = page.locator('ion-list');
|
||||
|
||||
await expect(list).toHaveScreenshot(screenshot(`item-slotted-inputs-toggle`));
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
|
After Width: | Height: | Size: 7.8 KiB |
|
After Width: | Height: | Size: 8.0 KiB |
|
After Width: | Height: | Size: 7.0 KiB |
|
After Width: | Height: | Size: 5.8 KiB |
|
After Width: | Height: | Size: 6.9 KiB |
|
After Width: | Height: | Size: 5.1 KiB |
|
Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 23 KiB |
|
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 28 KiB |
|
Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 22 KiB |
|
Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 23 KiB |
|
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 28 KiB |
|
Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 22 KiB |
|
Before Width: | Height: | Size: 21 KiB After Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 21 KiB After Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 5.3 KiB |
|
After Width: | Height: | Size: 6.7 KiB |
|
After Width: | Height: | Size: 4.8 KiB |
|
After Width: | Height: | Size: 7.6 KiB |
|
After Width: | Height: | Size: 7.9 KiB |
|
After Width: | Height: | Size: 6.9 KiB |
|
After Width: | Height: | Size: 6.8 KiB |
|
After Width: | Height: | Size: 7.7 KiB |
|
After Width: | Height: | Size: 5.9 KiB |
|
After Width: | Height: | Size: 5.9 KiB |
|
After Width: | Height: | Size: 6.9 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 9.3 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 8.5 KiB |
|
After Width: | Height: | Size: 8.5 KiB |
|
After Width: | Height: | Size: 9.9 KiB |
|
After Width: | Height: | Size: 7.6 KiB |
@@ -74,7 +74,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, screenshot, c
|
||||
|
||||
await ionLoadingDidPresent.next();
|
||||
|
||||
const button = page.locator('ion-loading ion-button');
|
||||
const button = page.locator('ion-loading button');
|
||||
|
||||
if (browserName === 'webkit') {
|
||||
await page.keyboard.down('Alt');
|
||||
|
||||
@@ -29,7 +29,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
|
||||
|
||||
test('should trap focus', async ({ page, skip, browserName }) => {
|
||||
skip.browser('firefox', 'Firefox incorrectly allows keyboard focus to move to ion-content');
|
||||
// TODO (FW-2979)
|
||||
// TODO (ROU-5437)
|
||||
skip.browser('webkit', 'Safari 16 only allows text fields and pop-up menus to be focused.');
|
||||
const ionDidOpen = await page.spyOnEvent('ionDidOpen');
|
||||
|
||||
|
||||
@@ -24,7 +24,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
|
||||
|
||||
await modal.evaluate((modal: HTMLIonModalElement) => {
|
||||
modal.remove();
|
||||
document.querySelector('ion-button')?.insertAdjacentElement('afterend', modal);
|
||||
document.querySelector('button')?.insertAdjacentElement('afterend', modal);
|
||||
});
|
||||
await page.waitForChanges();
|
||||
|
||||
|
||||
@@ -18,7 +18,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
|
||||
|
||||
test.describe('pushing a new page', () => {
|
||||
test('should render the pushed component', async ({ page }) => {
|
||||
const pageTwoButton = page.locator('ion-button:has-text("Go to Page Two")');
|
||||
const pageTwoButton = page.locator('button:has-text("Go to Page Two")');
|
||||
const pageOne = page.locator('page-one');
|
||||
const pageTwo = page.locator('page-two');
|
||||
|
||||
@@ -32,7 +32,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
|
||||
});
|
||||
|
||||
test('should render the back button', async ({ page }) => {
|
||||
const pageTwoButton = page.locator('ion-button:has-text("Go to Page Two")');
|
||||
const pageTwoButton = page.locator('button:has-text("Go to Page Two")');
|
||||
const pageTwoBackButton = page.locator('page-two ion-back-button');
|
||||
|
||||
await pageTwoButton.click();
|
||||
@@ -45,7 +45,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
|
||||
test('back button should pop to the previous page', async ({ page }) => {
|
||||
const pageOne = page.locator('page-one');
|
||||
const pageTwo = page.locator('page-two');
|
||||
const pageTwoButton = page.locator('ion-button:has-text("Go to Page Two")');
|
||||
const pageTwoButton = page.locator('button:has-text("Go to Page Two")');
|
||||
const pageTwoBackButton = page.locator('page-two ion-back-button');
|
||||
|
||||
await pageTwoButton.click();
|
||||
@@ -65,8 +65,8 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
|
||||
const pageTwo = page.locator('page-two');
|
||||
const pageThree = page.locator('page-three');
|
||||
|
||||
const pageTwoButton = page.locator('ion-button:has-text("Go to Page Two")');
|
||||
const pageThreeButton = page.locator('ion-button:has-text("Go to Page Three")');
|
||||
const pageTwoButton = page.locator('button:has-text("Go to Page Two")');
|
||||
const pageThreeButton = page.locator('button:has-text("Go to Page Three")');
|
||||
|
||||
await pageTwoButton.click();
|
||||
await page.waitForChanges();
|
||||
|
||||
@@ -16,8 +16,8 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
|
||||
const pageOne = page.locator('page-one');
|
||||
const pageTwo = page.locator('page-two');
|
||||
|
||||
const pageTwoButton = page.locator('ion-button:has-text("Go to Page 2")');
|
||||
const pageTwoTwoButton = page.locator('ion-button:has-text("Go to Page 2.2")');
|
||||
const pageTwoButton = page.locator('button:has-text("Go to Page 2")');
|
||||
const pageTwoTwoButton = page.locator('button:has-text("Go to Page 2.2")');
|
||||
|
||||
await pageTwoButton.click();
|
||||
await page.waitForChanges();
|
||||
@@ -35,7 +35,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
|
||||
await expect(pageTwoOne).toHaveCount(1);
|
||||
await expect(pageTwoTwo).toBeVisible();
|
||||
|
||||
const pageThreeButton = page.locator('ion-button:has-text("Go to Page 3")');
|
||||
const pageThreeButton = page.locator('button:has-text("Go to Page 3")');
|
||||
|
||||
await pageThreeButton.click();
|
||||
await page.waitForChanges();
|
||||
@@ -49,8 +49,8 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
|
||||
|
||||
test.describe('back button', () => {
|
||||
test('should work with nested ion-nav', async ({ page }) => {
|
||||
const pageTwoButton = page.locator('ion-button:has-text("Go to Page 2")');
|
||||
const pageTwoTwoButton = page.locator('ion-button:has-text("Go to Page 2.2")');
|
||||
const pageTwoButton = page.locator('button:has-text("Go to Page 2")');
|
||||
const pageTwoTwoButton = page.locator('button:has-text("Go to Page 2.2")');
|
||||
|
||||
await pageTwoButton.click();
|
||||
await page.waitForChanges();
|
||||
@@ -61,7 +61,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
|
||||
await pageTwoTwoButton.click();
|
||||
await page.waitForChanges();
|
||||
|
||||
const pageThreeButton = page.locator('ion-button:has-text("Go to Page 3")');
|
||||
const pageThreeButton = page.locator('button:has-text("Go to Page 3")');
|
||||
const pageThreeBackButton = page.locator('page-three ion-back-button');
|
||||
|
||||
await pageThreeButton.click();
|
||||
|
||||
@@ -24,8 +24,8 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
|
||||
const pageOne = page.locator('page-one');
|
||||
const pageTwo = page.locator('page-two');
|
||||
|
||||
const pageOneButton = page.locator('ion-button:has-text("Go to Page One")');
|
||||
const pageTwoButton = page.locator('ion-button:has-text("Go to Page Two")');
|
||||
const pageOneButton = page.locator('button:has-text("Go to Page One")');
|
||||
const pageTwoButton = page.locator('button:has-text("Go to Page Two")');
|
||||
|
||||
await pageOneButton.click();
|
||||
await page.waitForChanges();
|
||||
@@ -45,7 +45,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
|
||||
});
|
||||
|
||||
test('should render the back button', async ({ page }) => {
|
||||
const pageOneButton = page.locator('ion-button:has-text("Go to Page One")');
|
||||
const pageOneButton = page.locator('button:has-text("Go to Page One")');
|
||||
const pageOneBackButton = page.locator('page-one ion-back-button');
|
||||
|
||||
await pageOneButton.click();
|
||||
@@ -59,7 +59,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
|
||||
const pageRoot = page.locator('page-root');
|
||||
const pageOne = page.locator('page-one');
|
||||
|
||||
const pageOneButton = page.locator('ion-button:has-text("Go to Page One")');
|
||||
const pageOneButton = page.locator('button:has-text("Go to Page One")');
|
||||
const pageOneBackButton = page.locator('page-one ion-back-button');
|
||||
|
||||
await pageOneButton.click();
|
||||
@@ -80,9 +80,9 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
|
||||
const pageTwo = page.locator('page-two');
|
||||
const pageThree = page.locator('page-three');
|
||||
|
||||
const pageOneButton = page.locator('ion-button:has-text("Go to Page One")');
|
||||
const pageTwoButton = page.locator('ion-button:has-text("Go to Page Two")');
|
||||
const pageThreeButton = page.locator('ion-button:has-text("Go to Page Three")');
|
||||
const pageOneButton = page.locator('button:has-text("Go to Page One")');
|
||||
const pageTwoButton = page.locator('button:has-text("Go to Page Two")');
|
||||
const pageThreeButton = page.locator('button:has-text("Go to Page Three")');
|
||||
|
||||
await pageOneButton.click();
|
||||
await page.waitForChanges();
|
||||
|
||||
@@ -212,8 +212,8 @@ export class PickerColumn implements ComponentInterface {
|
||||
*/
|
||||
@Method()
|
||||
async setFocus() {
|
||||
if (this.scrollEl) {
|
||||
this.scrollEl.focus();
|
||||
if (this.assistiveFocusable) {
|
||||
this.assistiveFocusable.focus();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -619,7 +619,7 @@ export class PickerColumn implements ComponentInterface {
|
||||
}
|
||||
|
||||
if (newOption !== null) {
|
||||
this.value = newOption.value;
|
||||
this.setValue(newOption.value);
|
||||
|
||||
// This stops any default browser behavior such as scrolling
|
||||
ev.preventDefault();
|
||||
@@ -687,6 +687,25 @@ export class PickerColumn implements ComponentInterface {
|
||||
ref={(el) => {
|
||||
this.scrollEl = el;
|
||||
}}
|
||||
/**
|
||||
* When an element has an overlay scroll style and
|
||||
* a fixed height, Firefox will focus the scrollable
|
||||
* container if the content exceeds the container's
|
||||
* dimensions.
|
||||
*
|
||||
* This causes keyboard navigation to focus to this
|
||||
* element instead of going to the next element in
|
||||
* the tab order.
|
||||
*
|
||||
* The desired behavior is for the user to be able to
|
||||
* focus the assistive focusable element and tab to
|
||||
* the next element in the tab order. Instead of tabbing
|
||||
* to this element.
|
||||
*
|
||||
* To prevent this, we set the tabIndex to -1. This
|
||||
* will match the behavior of the other browsers.
|
||||
*/
|
||||
tabIndex={-1}
|
||||
>
|
||||
<div class="picker-item-empty" aria-hidden="true">
|
||||
|
||||
|
||||
@@ -40,7 +40,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
|
||||
|
||||
await popover.evaluate((popover: HTMLIonPopoverElement) => {
|
||||
popover.remove();
|
||||
document.querySelector('ion-button')?.insertAdjacentElement('afterend', popover);
|
||||
document.querySelector('button')?.insertAdjacentElement('afterend', popover);
|
||||
});
|
||||
await page.waitForChanges();
|
||||
|
||||
|
||||
@@ -72,6 +72,11 @@ input {
|
||||
*/
|
||||
:host([slot="start"]),
|
||||
:host([slot="end"]) {
|
||||
// Reset the flex property when the checkbox
|
||||
// is slotted to avoid growing the element larger
|
||||
// than its content.
|
||||
flex: initial;
|
||||
|
||||
width: auto;
|
||||
}
|
||||
|
||||
|
||||
@@ -363,7 +363,7 @@ export class Searchbar implements ComponentInterface {
|
||||
this.ionClear.emit();
|
||||
|
||||
return new Promise<void>((resolve) => {
|
||||
// setTimeout() fixes https://github.com/ionic-team/ionic/issues/7527
|
||||
// setTimeout() fixes https://github.com/ionic-team/ionic-framework/issues/7527
|
||||
// wait for 4 frames
|
||||
setTimeout(() => {
|
||||
const value = this.getValue();
|
||||
|
||||
@@ -20,7 +20,7 @@ const checkedOptions: SelectPopoverOption[] = [
|
||||
configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
|
||||
test.describe(title('select-popover: basic'), () => {
|
||||
test.beforeEach(({ browserName }) => {
|
||||
test.skip(browserName === 'webkit', 'https://ionic-cloud.atlassian.net/browse/FW-2979');
|
||||
test.skip(browserName === 'webkit', 'ROU-5437');
|
||||
});
|
||||
|
||||
test.describe('single selection', () => {
|
||||
@@ -55,7 +55,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
|
||||
});
|
||||
|
||||
test('pressing Space on a selected option should dismiss the popover', async ({ browserName }) => {
|
||||
test.skip(browserName === 'firefox', 'Same behavior as https://ionic-cloud.atlassian.net/browse/FW-2979');
|
||||
test.skip(browserName === 'firefox', 'Same behavior as ROU-5437');
|
||||
|
||||
await selectPopoverPage.setup(config, checkedOptions, false);
|
||||
|
||||
|
||||