This commit does a lot to try and meld the v6 migration to work against the test app. The introduction of `<Routes>` component from react-router means much of the logic around querying the `<Route>` as the direct child of the outlet and also cloning the element, leads to a broken experience. This commit tries to handle that requirement.
Additional discovery will try to uncover if we can move the `<Routes>` inside of the outlet so the developer doesn't need to specify it when upgrading (and perhaps can simplify how we query the nodes).
Discovered this while working through errors during the migration. When a page is invisible, the elements are still clickable. This is not expected behavior.
React Router v6 exposes hooks to listen for history/location change. This implementation doesn't provide anything extra and should be removed completely AFAIK.
React Router v6 exposes hooks to listen for history/location change. This implementation doesn't provide anything extra and should be removed completely AFAIK.
Issue number: Resolves#27146
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
When an `ion-nav` is presented multiple times in an overlay, the user's
`root` component will attempt to be attached twice. This results in the
view being mounted without the `rootParams` being defined, causing an
exception in a user's application.
This behavior occurs due to the `root` watch callback firing twice. The
second time the `ion-nav` is presented in an overlay, the watch callback
will execute _before_ `componentDidLoad` fires. This results in the
watch callback firing twice, once from the underlying change detection
and the second time from [manually calling the
function](https://github.com/ionic-team/ionic-framework/blob/main/core/src/components/nav/nav.tsx#L115)
from `componentDidLoad`.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- `ion-nav` includes a new flag to track when `componentDidLoad`
executes. This allows us to prevent the behavior of the `rootChanged`
callback from happening when the component has not loaded.
- `ion-nav` consistently attaches the `rootParams` to the `root`
component.
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->
## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
Dev-build: `7.0.15-dev.11687924603.10a1e477`.
### How to test
You can install against the reproduction app in the linked issue to
verify the behavior before and after.
- Before, the app will throw an exception when presenting the modal the
second time.
- After, the app will not throw an exception when presenting the modal
the second time. Information that you fill out on the main screen form
will be rendered inside the modal content.
Issue number: N/A
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
See https://github.com/ionic-team/ionic-framework/issues/27709
The `ionInput` description is vague and does not clarify that it only
fires as the user types.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Clarified the ionInput description for input and textarea
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->
## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
Issue number: N/A
---------
## What is the current behavior?
Nightly build and release broken in #27711 due to missing shell property
in GitHub Actions workflow.
## What is the new behavior?
- Nightly build and release works.
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
## Other information
Issue number: internal ticket
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
Size tests were being skipped.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Size tests are no longer being skipped.
- Size tests have been provided comments to explain flakiness.
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->
## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
I recommend adding a `.only` to the `popover: visible backdrop` and
running the test with `npm run test.e2e popover -- --repeat-each 100` a
few times
---------
Co-authored-by: ionitron <hi@ionicframework.com>
Issue number: #
---------
## What is the current behavior?
Package provenance was disabled in #27656.
## What is the new behavior?
- Package provenance is enabled.
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
## Other information
Issue number: N/A
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
We have a workflow that is no longer needed (that I wrote 🙃)
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
remove the stencil v4 nightly workflow following the stencil v4 release
on 2023.06.26
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->
## Other information
I'll have to take a look at the Actions tab at GitHub after this is
merged. I may have to do some manual cleanup (deleting workflow runs)
once this file is no longer in the repo.
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
Issue number: -
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
I forgot to address the tests when working on FW-2608 to address issue
#26103
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Updated the visual regressions tests to verify that the item-sliding
displays correctly on LTR/RTL.
- Updated the item sliding tests to use the generators
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->
## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
The tests for item-sliding are disabled due to gesture flakiness. This
will be addressed in another ticket. I recommend testing locally by
adding the `.only` to all tests called `should not have visual
regressions` and running `npm run test.e2e item-sliding`.
Issue number: resolves#27688
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
Autogrow broke as a result of
8bcd9e8b35.
`white-space: pre-wrap` used to be on the host, but it was discovered
that this caused textareas that had any white space to break visually.
As a result, I moved `white-space: pre-wrap` to apply on the host only
for the legacy textarea. The modern textarea had `white-space: pre-wrap`
set on the native textarea.
We also had `white-space: pre-wrap` set on the `::after` pseudo element
for autogrow:
f29c66aee2/core/src/components/textarea/textarea.scss (L311)
However, we also use the `text-inherit` mixin:
f29c66aee2/core/src/components/textarea/textarea.scss (L322)
This mixin sets `white-space: inherit` and also overrides the `pre-wrap`
we had set. As a result, the whitespace was being inherited from the
default white space instead of `pre-wrap`.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Textarea no longer overrides the explicit `white-space: pre-wrap` on
the `::after` element.
- Re-enabled a skipped autogrow test that would have caught this bug
- Fixed a whitespace issue in another autogrow test
Note: The legacy screenshot diffs in
6ba2093166
are unrelated to this PR. Now that we are unskipping them the
screenshots have been updated. I verified this in
https://github.com/ionic-team/ionic-framework/pull/27692. This PR shows
a branch created off `7.0.x` (which does not have the reported
regression) and the tests enabled w/ the screenshots updated. The linked
verification PR can be closed when this PR merges.
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->
## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
Dev build: 7.1.1-dev.11687532007.11a1a9a4
---------
Co-authored-by: ionitron <hi@ionicframework.com>
Issue number: N/A
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
There is a known bug in a dependency that Stencil uses to process CSS
that causes the build to fail on Ionicons 7.1.1+. Our
`package-lock.json` always installs 7.1.0, but if you remove the package
lock you'll get a newer version of Ionicons that triggers the bug.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Core installs only ionicons 7.1.0 until the underlying bug is resolved
(tracked internally)
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->
## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
Issue number: resolves#27061
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
Textarea does not accept custom HTML labels
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Textarea accepts custom HTML labels as an experimental feature. We
marked this as experimental because it makes use of "scoped slots" which
is an emulated version of Web Component slots. As a result, there may be
instances where the slot behavior does not exactly match the native slot
behavior.
Note to reviewers: This is a combination of previously reviewed PRs. The
implementation is complete, so feel free to bikeshed.
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->
## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
Docs PR: https://github.com/ionic-team/ionic-docs/pull/3001
---------
Co-authored-by: ionitron <hi@ionicframework.com>
Issue number: resolves#17248
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
While the `icon` shadow part allows customization of the existing toggle
icon, developers do not have a way to specify a different icon to use
entirely.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
New props `toggleIcon` and `expandedIcon` added. (Design docs are
[here](https://github.com/ionic-team/ionic-framework-design-documents/blob/main/projects/ionic-framework/components/select/0002-custom-icons.md)
and
[here](https://github.com/ionic-team/ionic-framework-design-documents/blob/main/projects/ionic-framework/components/select/0003-custom-icon-on-open.md)
respectively.)
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->
## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
Docs PR: https://github.com/ionic-team/ionic-docs/pull/2996
Dev build: `7.0.15-dev.11687278023.161b97d8`
---------
Co-authored-by: ionitron <hi@ionicframework.com>
Issue number: resolves#27061
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
Input does not accept custom HTML labels
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Input accepts custom HTML labels as an experimental feature. We marked
this as experimental because it makes use of "scoped slots" which is an
emulated version of Web Component slots. As a result, there may be
instances where the slot behavior does not exactly match the native slot
behavior.
Note to reviewers: This is a combination of previously reviewed PRs. The
implementation is complete, so feel free to bikeshed.
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->
## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
Docs PR: https://github.com/ionic-team/ionic-docs/pull/2997
---------
Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.com>