Issue number: resolves#28137
---------
Changes according to [this
comment](https://github.com/ionic-team/ionic-framework/issues/28137#issuecomment-1710283096)
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
@liamdebeasi Sorry for replacing the previous PR. I only copied the main
branch to my fork so I couldn't rebase properly. I am unfortunately not
extremely familiar with Github.
---------
Co-authored-by: Philipp Heuer <philipp@studysmarter.de>
Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com>
Issue number: internal
---------
<!-- 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. -->
The `--ion-safe-area-left` and `--ion-safe-area-right` variables in
`ion-menu` are being set as if they use the app's direction. It's been
determined that safe area is not logical and uses the device's
direction. The current implementation is adding padding in the wrong
sides for `ion-toolbar` and `ion-content` within a `ion-menu`.
Additionally, `ion-menu` does not use the entire screen so the safe area
only needs to be applied to the side that is touching the device screen.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Set the `--ion-safe-area-left` and `--ion-safe-area-right` variables
to the correct values based on the device's direction.
- Padding is only added to the side that is not in the safe area.
- `ion-toolbar` is adding `--ion-safe-area-left` and
`--ion-safe-area-right` based on the device's direction.
- `ion-toolbar` can now inherit the correct values from
`--ion-safe-area-left` and `--ion-safe-area-right`.
- `ion-content` can now inherit the correct values from
`--ion-safe-area-left` and `--ion-safe-area-right`.
## 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.3.4-dev.11694015543.18bc484f
Issue number: resolves#25340
---------
- Exposes the following parts for a calendar day: `calendar-day`,
`today`, and `active`
- Combines the `calendar-day-highlight` element with the `calendar-day`
element so developers don't have to know to style two different elements
& we don't have to expose them as separate parts
- Improves height parity of the calendar day across browsers
- Updates the `custom` e2e test to include an example of styling days
using the newly exposed CSS parts
- Adds tests for the focus states of the calendar day
Issue number: resolves#28105
---------
<!-- 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 swiping to dismiss the card modal, the status bar style is reset
too late. Since we are using 1 animation for the card modal, the dismiss
animation is played _then_ the `dismiss` method is called (which resets
the status bar style). This means the status bar style is wrong for the
duration of the dismiss animation.
This does not impact dragging to close the modal such that the status
bar changes mid-gesture or calling the `dismiss` method directly -- only
quickly swiping to dismiss.
Also one of the changes in core/src/components/modal/modal.tsx
accidentally changed the modal behavior so that the status bar is
changed _after_ the present transition finishes.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- When the card modal is swiped to dismiss the `onDismiss` callback will
also reset the status bar style.
- When the card modal is presented the status bar is set correctly as
the animation begins
| `main` | branch |
| - | - |
| <video
src="https://github.com/ionic-team/ionic-framework/assets/2721089/8a18419d-a7ec-4629-8632-62e2ed401912"></video>
| <video
src="https://github.com/ionic-team/ionic-framework/assets/2721089/62ffcf00-8dbd-4e0c-83a3-5af5d463bccc"></video>
|
## 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.3.3-dev.11693592322.138d91e6`
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. -->
The progress bar basic test makes use of the `ion-range` component in
the captured screenshot. This results in tight coupling when the
appearance of the range changes.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Decouples `ion-range` from the progress bar basic screenshot captures
- Splits out dynamic behavior that was used with `ion-range` to test
files that can be manually interacted with
## 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. -->
---------
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. -->
Radio has a test with the wrong screenshot name of toggle.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Radio has a test with the correct screenshot name.
## 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. -->
N/A
Issue number: resolves#22142
---------
<!-- 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 always takes up the entire width of a line which prevents the
`cols` property from working correctly.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- The textarea respects the `col` property value only when `autoGrow` is
`false`
## 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.3.2-dev.11693402720.1adb3bcf`
---------
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. -->
In addition to migrating away from `toMatchSnapshot` as found in PRs
such as https://github.com/ionic-team/ionic-framework/pull/28083, I
think it would be valuable to have a lint rule to prevent developers
from accidentally using this API in the future.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Adds a lint rule which errors if `toMatchSnapshot` is being used in
`*.e2e.ts` files.
## 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. -->
~Note: This PR's lint step will continue to fail until the remaining
`toHaveScreenshot` migration PRs have been merged. Do note merge this PR
until that has been completed.~ All set!
---------
Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.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. -->
Several tests for this component are still using Playwright's old
`toMatchSnapshot` assertion. It's now recommended to use the newer
`toHaveScreenshot` assertion. This new assertion reduces the size of
each screenshot and brings anti-flake improvements such as disabling
animations by default.
We previously migrated most of our codebase to use `toHaveScreenshot`,
but it looks like we missed the tests that were written during the
development of Ionic 7 in a separate branch off `main`.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Migrate component tests to use `toHaveScreenshot`.
Note: There should be no layout changes to any of the screenshots. The
only difference between the old and new screenshots should be image and
file size.
## 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. -->
---------
Co-authored-by: ionitron <hi@ionicframework.com>
Issue number: resolves#27200
---------
<!-- 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. -->
A bug occurs when you click twice quickly to open an overlay with a
small timeout. In some cases, the overlay will present, dismiss,
present, then not dismiss the second time, getting stuck open. You can
reproduce manually this by grabbing the test HTML included in this PR
and putting it in a branch that doesn't include a fix.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- When an overlay with a short timeout is triggered twice quickly, it
will open-close-open-close.
- The behavior is the same for all overlay components
## 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. -->
Relevant links:
* https://github.com/ionic-team/ionic-framework/issues/27200
* https://ionic-cloud.atlassian.net/browse/FW-4374
* https://ionic-cloud.atlassian.net/browse/FW-4053
I'm not sure how to write an automated test for this bug due to the
short timeout required.
You can manually test the fix in [this
Stackblitz](https://stackblitz.com/edit/g1kjci?file=package.json) by
changing the Ionic version between 7.3.1 and
7.3.2-dev.11693262117.17edbf6d
---------
Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.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 are two problems with this test:
1. The screenshots are not capturing the correct UI. For example, the
following screenshot should capture the date and time grid picker, but
it's only capturing the year wheel picker:
8ab3476ac7/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-Mobile-Safari-linux.png
2. These screenshots are flaky. This is possibly due to how they were
written where they iterate through an array, select a value from the
`select`, and then wait a timeout for the view to change.
3. I also discovered that we'll have some visual diffs once 2024 hits.
The current value of the datetime on the wheel picker is 2022. 2023 is
shown, but 2024 is not (since we are still in 2023). Once Jan 1 2024
hits, these tests will likely start to fail with visual diffs.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Refactored these tests to use a test fixture where each presentation
is a separate test. This ensures that the tests are correct. Because
there is less interaction going on with the page (i.e. the correct
presentation is set on load), my hope is that this also reduces test
flakiness.
- Also changed the date used to be several years ago so we don't have
new years showing up in the wheel picker screenshots as time goes on.
## 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. -->
---------
Co-authored-by: ionitron <hi@ionicframework.com>
Issue number: resolves#27190, resolves#24780
---------
<!-- 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. -->
Popovers with dynamic widths were not being positioned correctly
relative to the trigger element. This was happening because the child
component always had dimensions of 0 x 0. Ionic has logic built-in to
wait for the child components to be rendered, but this was not working
as intended for two reasons:
1. `this.usersElement` was referencing the popover element itself not
the user’s component. When calling `deepReady` on
01fc9b4511/core/src/components/popover/popover.tsx (L477)
we are waiting for the popover to be hydrated, not the child content.
The popover was already hydrated on page load, so this resolves
immediately. However, the child content that was just added to the DOM
has not yet been hydrated, so we aren’t waiting long enough.
This is happening because we return `BaseComponent `from
`attachComponent` which is a reference to the overlay:
01fc9b4511/core/src/utils/framework-delegate.ts (L133)
Other framework delegates return the actual child content:
- Core delegate with controller:
01fc9b4511/core/src/utils/framework-delegate.ts (L35)
(this is part of why the controller popover works but the inline popover
does not)
- React delegate:
01fc9b4511/packages/react/src/framework-delegate.tsx (L31)
- Vue delegate:
01fc9b4511/packages/vue/src/framework-delegate.ts (L45)
2. `attachComponent` is unable to return the correct element currently
because the child content has not been mounted yet in this scenario.
`ionMount` is emitted after `attachComponent` resolves:
01fc9b4511/core/src/components/popover/popover.tsx (L466)
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- `ionMount` is emitted before `attachComponent` runs
- `attachComponent` now consistently returns the child view if present
in the DOM
- Added a test
## 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.3.2-dev.11693321763.15a54694`
---------
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. -->
Several tests for this component are still using Playwright's old
`toMatchSnapshot` assertion. It's now recommended to use the newer
`toHaveScreenshot` assertion. This new assertion reduces the size of
each screenshot and brings anti-flake improvements such as disabling
animations by default.
We previously migrated most of our codebase to use `toHaveScreenshot`,
but it looks like we missed the tests that were written during the
development of Ionic 7 in a separate branch off `main`.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Migrate component tests to use `toHaveScreenshot`.
Note: There should be no layout changes to any of the screenshots. The
only difference between the old and new screenshots should be image and
file size.
## 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. -->
---------
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. -->
Several tests for this component are still using Playwright's old
`toMatchSnapshot` assertion. It's now recommended to use the newer
`toHaveScreenshot` assertion. This new assertion reduces the size of
each screenshot and brings anti-flake improvements such as disabling
animations by default.
We previously migrated most of our codebase to use `toHaveScreenshot`,
but it looks like we missed the tests that were written during the
development of Ionic 7 in a separate branch off `main`.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Migrate component tests to use `toHaveScreenshot`.
Note: There should be no layout changes to any of the screenshots. The
only difference between the old and new screenshots should be image and
file size.
## 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. -->
---------
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. -->
That particular test is flaky. When going to try and fix the flakiness,
I realized that this behavior is already tested by another test. This
test presents the `ion-picker-internal` components which are also tested
in
7c2b6aed05/core/src/components/datetime/test/custom/datetime.e2e.ts (L10).
These show the same components which have the same APIs, so this test
shouldn't even be needed.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Removed the duplicate test
## 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
---------
<!-- 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. -->
Several tests for this component are still using Playwright's old
`toMatchSnapshot` assertion. It's now recommended to use the newer
`toHaveScreenshot` assertion. This new assertion reduces the size of
each screenshot and brings anti-flake improvements such as disabling
animations by default.
We previously migrated most of our codebase to use `toHaveScreenshot`,
but it looks like we missed the tests that were written during the
development of Ionic 7 in a separate branch off `main`.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Migrate component tests to use `toHaveScreenshot`.
Note: There should be no layout changes to any of the screenshots. The
only difference between the old and new screenshots should be image and
file size.
## 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. -->
---------
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. -->
Several tests for this component are still using Playwright's old
`toMatchSnapshot` assertion. It's now recommended to use the newer
`toHaveScreenshot` assertion. This new assertion reduces the size of
each screenshot and brings anti-flake improvements such as disabling
animations by default.
We previously migrated most of our codebase to use `toHaveScreenshot`,
but it looks like we missed the tests that were written during the
development of Ionic 7 in a separate branch off `main`.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Migrate component tests to use `toHaveScreenshot`.
Note: There should be no layout changes to any of the screenshots. The
only difference between the old and new screenshots should be image and
file size.
## 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. -->
---------
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. -->
Several tests for this component are still using Playwright's old
`toMatchSnapshot` assertion. It's now recommended to use the newer
`toHaveScreenshot` assertion. This new assertion reduces the size of
each screenshot and brings anti-flake improvements such as disabling
animations by default.
We previously migrated most of our codebase to use `toHaveScreenshot`,
but it looks like we missed the tests that were written during the
development of Ionic 7 in a separate branch off `main`.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Migrate component tests to use `toHaveScreenshot`.
Note: There should be no layout changes to any of the screenshots. The
only difference between the old and new screenshots should be image and
file size.
## 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. -->
---------
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. -->
Several tests for this component are still using Playwright's old
`toMatchSnapshot` assertion. It's now recommended to use the newer
`toHaveScreenshot` assertion. This new assertion reduces the size of
each screenshot and brings anti-flake improvements such as disabling
animations by default.
We previously migrated most of our codebase to use `toHaveScreenshot`,
but it looks like we missed the tests that were written during the
development of Ionic 7 in a separate branch off `main`.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Migrate component tests to use `toHaveScreenshot`.
Note: There should be no layout changes to any of the screenshots. The
only difference between the old and new screenshots should be image and
file size.
## 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. -->
---------
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. -->
The `text-wrap` attribute was removed in Ionic v5, but references to it
still exist in the `ion-label` stylesheets.
https://github.com/ionic-team/ionic-framework/blob/main/BREAKING_ARCHIVE/v5.md#css-utilities
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Removed references to the unsupported `text-wrap` attributed.
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
Note: This is not a breaking change because support for `text-wrap` was
removed in Ionic v5.
<!-- 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
---------
<!-- 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. -->
Router outlet files can be hard to find when searching for them.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Router outlet files are named what you'd expect.
## 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#28041
---------
<!-- 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. -->
`parseDate` returns `undefined` when given an invalid value. However,
our min/max processing functions did not account for this. As a result,
we would attempt to destructure an undefined value which resulted in an
error.
Note regarding linked issue: The developer is calling
`setMin(undefined)`. However, this is triggering a React quirk with
Custom Elements where `undefined` is being set to `null` inside of
React. The type signature on min/max is `string | undefined`, so `null`
is being treated as an invalid date value.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Min/Max processing functions now return `undefined` if the input was
invalid.
## 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.3.2-dev.11692887667.1614d10a`
Issue number: resolves#28030
---------
<!-- 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. -->
`ion-menu` registers itself with the menu controller when
`connectedCallback` fires and then unregisters itself when
`disconnectedCallback` fires. When the menu was removed from the DOM,
`disconnectedCallback` was not always being fired due to
https://github.com/ionic-team/stencil/issues/4070.
`ion-menu-button` checks to see if it should be visible by grabbing the
current menu in
314055cf7a/core/src/components/menu-button/menu-button.tsx (L74).
Since `disconnectedCallback` was not being fired, `ion-menu-button`
would still find the menu even when it was no longer in the DOM. In this
case, the menu was not being unregistered due to `disconnectedCallback`
not firing.
When the linked Stencil bug was resolved in Stencil 4.0.3, the menu
button started to disappear. This is happening because
`disconnectedCallback` is now correctly called when the menu is removed
from the DOM. Since `disconnectedCallback` is called, the menu is
un-registered from the menu controller, and the menu button can no
longer find it.
However, this revealed a long-standing bug where re-adding the menu
would not fire `ionMenuChange` again. As a result, the menu button
remained hidden.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- The menu now fires `ionMenuChange` on `connectedCallback` as long as
`componentDidLoad` has already been run.
## 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.3.2-dev.11692803611.15c1bc87`
---------
Co-authored-by: Sean Perkins <sean@ionic.io>
Bumps [@capacitor/core](https://github.com/ionic-team/capacitor) from
5.2.3 to 5.3.0.
<details>
<summary>Release notes</summary>
<p><em>Sourced from <a
href="https://github.com/ionic-team/capacitor/releases"><code>@capacitor/core</code>'s
releases</a>.</em></p>
<blockquote>
<h2>5.3.0</h2>
<h1><a
href="https://github.com/ionic-team/capacitor/compare/5.2.3...5.3.0">5.3.0</a>
(2023-08-23)</h1>
<h3>Bug Fixes</h3>
<ul>
<li><strong>cookies:</strong> remove session cookies when initializing
the cookie manager (<a
href="037863bea6">037863b</a>)</li>
<li><strong>http:</strong> disconnect active connections if call or
bridge is destroyed (<a
href="a1ed6cc6f0">a1ed6cc</a>)</li>
<li><strong>http:</strong> return numbers and booleans as-is when
application/json is the content type (<a
href="03dd3f96c7">03dd3f9</a>)</li>
</ul>
<h3>Features</h3>
<ul>
<li>better support monorepos (<a
href="https://redirect.github.com/ionic-team/capacitor/issues/6811">#6811</a>)
(<a
href="ae35e29fb8">ae35e29</a>)</li>
</ul>
</blockquote>
</details>
<details>
<summary>Changelog</summary>
<p><em>Sourced from <a
href="https://github.com/ionic-team/capacitor/blob/5.3.0/CHANGELOG.md"><code>@capacitor/core</code>'s
changelog</a>.</em></p>
<blockquote>
<h1><a
href="https://github.com/ionic-team/capacitor/compare/5.2.3...5.3.0">5.3.0</a>
(2023-08-23)</h1>
<h3>Bug Fixes</h3>
<ul>
<li><strong>cookies:</strong> remove session cookies when initializing
the cookie manager (<a
href="037863bea6">037863b</a>)</li>
<li><strong>http:</strong> disconnect active connections if call or
bridge is destroyed (<a
href="a1ed6cc6f0">a1ed6cc</a>)</li>
<li><strong>http:</strong> return numbers and booleans as-is when
application/json is the content type (<a
href="03dd3f96c7">03dd3f9</a>)</li>
</ul>
<h3>Features</h3>
<ul>
<li>better support monorepos (<a
href="https://redirect.github.com/ionic-team/capacitor/issues/6811">#6811</a>)
(<a
href="ae35e29fb8">ae35e29</a>)</li>
</ul>
</blockquote>
</details>
<details>
<summary>Commits</summary>
<ul>
<li><a
href="599aae4211"><code>599aae4</code></a>
Release 5.3.0</li>
<li><a
href="688767092e"><code>6887670</code></a>
chore: update files and workflows for 5.x branch (<a
href="https://redirect.github.com/ionic-team/capacitor/issues/6834">#6834</a>)</li>
<li><a
href="03dd3f96c7"><code>03dd3f9</code></a>
fix(http): return numbers and booleans as-is when application/json is
the con...</li>
<li><a
href="ae35e29fb8"><code>ae35e29</code></a>
feat: better support monorepos (<a
href="https://redirect.github.com/ionic-team/capacitor/issues/6811">#6811</a>)</li>
<li><a
href="037863bea6"><code>037863b</code></a>
fix(cookies): remove session cookies when initializing the cookie
manager</li>
<li><a
href="a1ed6cc6f0"><code>a1ed6cc</code></a>
fix(http): disconnect active connections if call or bridge is
destroyed</li>
<li>See full diff in <a
href="https://github.com/ionic-team/capacitor/compare/5.2.3...5.3.0">compare
view</a></li>
</ul>
</details>
<br />
[](https://docs.github.com/en/github/managing-security-vulnerabilities/about-dependabot-security-updates#about-compatibility-scores)
Dependabot will resolve any conflicts with this PR as long as you don't
alter it yourself. You can also trigger a rebase manually by commenting
`@dependabot rebase`.
[//]: # (dependabot-automerge-start)
[//]: # (dependabot-automerge-end)
---
<details>
<summary>Dependabot commands and options</summary>
<br />
You can trigger Dependabot actions by commenting on this PR:
- `@dependabot rebase` will rebase this PR
- `@dependabot recreate` will recreate this PR, overwriting any edits
that have been made to it
- `@dependabot merge` will merge this PR after your CI passes on it
- `@dependabot squash and merge` will squash and merge this PR after
your CI passes on it
- `@dependabot cancel merge` will cancel a previously requested merge
and block automerging
- `@dependabot reopen` will reopen this PR if it is closed
- `@dependabot close` will close this PR and stop Dependabot recreating
it. You can achieve the same result by closing it manually
- `@dependabot show <dependency name> ignore conditions` will show all
of the ignore conditions of the specified dependency
- `@dependabot ignore this major version` will close this PR and stop
Dependabot creating any more for this major version (unless you reopen
the PR or upgrade to it yourself)
- `@dependabot ignore this minor version` will close this PR and stop
Dependabot creating any more for this minor version (unless you reopen
the PR or upgrade to it yourself)
- `@dependabot ignore this dependency` will close this PR and stop
Dependabot creating any more for this dependency (unless you reopen the
PR or upgrade to it yourself)
</details>
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Issue number: Resolves#26391
---------
<!-- 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 updating the `value` programmatically on an `ion-datetime` after it
has already been created:
- With grid style: The selected date visually updates, but the calendar
does not scroll to the newly selected month.
- With wheel style: The selected date does not visually update, i.e. the
wheels do not move to show the newly selected date.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Grid style datetimes now scroll to the selected date using the same
animation as when clicking the next/prev month buttons.
- This animation mirrors the behavior in both MUI and native iOS. See
the [design
doc](https://github.com/ionic-team/ionic-framework-design-documents/blob/main/projects/ionic-framework/components/datetime/0003-datetime-async-value.md)
for more information and screen recordings.
- The animation will not occur if the month/year did not change, or when
the datetime is hidden.
- Wheel style datetimes now visually update to the selected date. No
animation occurs, also mirroring native.
- The `parseDate` util has also had its type signatures updated to
account for returning `undefined` when the date string is improperly
formatted. This was missed when the util was refactored to support
multiple date selection.
## 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/3053
- While this can technically be considered a bug fix, we are merging it
into a feature branch for safety; it's a fairly significant change to
how datetime behaves, and may interfere with custom logic when updating
a datetime's value async.
- Jumping to the newly selected value is handled by replacing everything
[here](https://github.com/ionic-team/ionic-framework/pull/27806/files#diff-4a407530c60e3cf72bcc11acdd21c4803a94bf47ea81b99e757db1c93d2735b8L364-L407)
with `processValue()`. This covers both wheel and grid datetimes.
- `activePartsClone` as a whole was also removed. It was added in
https://github.com/ionic-team/ionic-framework/pull/24244 to enable
changing `activeParts` without triggering a rerender (and thus jumping
to the new value) but since we now want to do that jump, the clone is no
longer needed.
- The animation code might be tricky to follow, so I recorded going
through it:
https://github.com/ionic-team/ionic-framework/assets/90629384/1afa5762-f493-441a-b662-f0429f2d86a7
## What is the current behavior?
There is no description of how to set the value of a picker.
## What is the new behavior?
Readers can find this description in the documentation.
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
---------
Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com>
Issue number: resolves#27746
---------
<!-- 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. -->
Pressing the Tab key when focused on an input/textarea with
`clearOnEdit` clears the text field and then moves focus to the next
focusable element.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Pressing the Tab key does not clear the text field even when
clearOnEdit is enabled.
- Added test coverage
- I also noticed that input did not have an `index.html` file in the
basic directory, so I added that.
## 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.3.1-dev.11692202566.13cd16c4`
As part of our incident learning review, the team would like to add
better documentation as to the purpose of `renderHiddenButton` for
future reference.
