Skip to content

fix(material/datepicker): matDatepickerParse error not being added on first invalid value - #11524

Merged
crisbeto merged 1 commit into
angular:masterfrom
crisbeto:11523/datepicker-first-time-validation
Feb 26, 2022
Merged

fix(material/datepicker): matDatepickerParse error not being added on first invalid value#11524
crisbeto merged 1 commit into
angular:masterfrom
crisbeto:11523/datepicker-first-time-validation

Conversation

@crisbeto

Copy link
Copy Markdown
Member

Fixes the datepicker not adding the matDatepickerParse error if the user enters an invalid string as their first value. The issue comes from the fact that we don't call the function from the ControlValueAccessor if the value hasn't changed, which means that the validator won't be re-run.

Fixes#11523.

@crisbeto
crisbeto requested a review from mmalerba as a code ownerMay 26, 2018 11:30
@googlebotgooglebot added the cla: yes PR author has agreed to Google's Contributor License Agreement label May 26, 2018
if (!date || hasChanged) {
this._cvaOnChange(date);
this._valueChange.emit(date);
this.dateInput.emit(new MatDatepickerInputEvent(this, this._elementRef.nativeElement));

@crisbetocrisbetoMay 26, 2018

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@mmalerba I was on the fence on whether this should also be emitted when the value stays null. I ended up doing it because its description implies that it matches the native input event. I'm fine with reverting to the old behavior where it only fires when something changes, if you think otherwise.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hmm ok. I think we have to make this a major change then and we can see how the presubmit goes. If it's not too difficult to change I agree that it should be changed.

if (!date || hasChanged) {
this._cvaOnChange(date);
this._valueChange.emit(date);
this.dateInput.emit(new MatDatepickerInputEvent(this, this._elementRef.nativeElement));

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hmm ok. I think we have to make this a major change then and we can see how the presubmit goes. If it's not too difficult to change I agree that it should be changed.

@mmalerbammalerba added pr: lgtm action: merge The PR is ready for merge by the caretaker target: major This PR is targeted for the next major release labels May 29, 2018
@raysuelzer

Copy link
Copy Markdown

Does this also fix the fact that after an invalid date is entered that removing the date entirely does not remove the validation error? For example, I type in xxxx into my date field. And then i decide I don't want to put any date into input becuase it is optional. But it is now impossible to get the form to validate because it believes that null or empty is an invalid date format?

@crisbetocrisbeto added target: patch This PR is targeted for the next patch release and removed target: major This PR is targeted for the next major release labels Oct 18, 2018
@crisbeto
crisbetoforce-pushed the 11523/datepicker-first-time-validation branch from 75ad13e to 9657aceCompareJanuary 6, 2019 20:28
@mmalerbammalerba added aaa and removed aaa labels Apr 25, 2019
@crisbeto
crisbetoforce-pushed the 11523/datepicker-first-time-validation branch from 9657ace to d714b7fCompareMay 30, 2019 06:25
@andrewseguinandrewseguin added the P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent label May 30, 2019
@mmalerbammalerba removed their assignment Aug 12, 2019
@crisbeto
crisbetoforce-pushed the 11523/datepicker-first-time-validation branch from d714b7f to d8e8780CompareMarch 25, 2020 21:13
@mmalerbammalerba removed the lgtm label Jul 31, 2020
@andrewseguinandrewseguin removed the cla: yes PR author has agreed to Google's Contributor License Agreement label Dec 29, 2021
@crisbetocrisbeto changed the title fix(datepicker): matDatepickerParse error not being added on first invalid valuefix(material/datepicker): matDatepickerParse error not being added on first invalid valueFeb 26, 2022
… first invalid value
Fixes the datepicker not adding the `matDatepickerParse` error if the user enters an invalid string as their first value. The issue comes from the fact that we don't call the function from the `ControlValueAccessor` if the value hasn't changed, which means that the validator won't be re-run.
Fixesangular#11523.
@crisbeto
crisbetoforce-pushed the 11523/datepicker-first-time-validation branch from d8e8780 to 297b16cCompareFebruary 26, 2022 07:58
@crisbeto
crisbeto merged commit 09a906a into angular:masterFeb 26, 2022
crisbeto added a commit that referenced this pull request Feb 26, 2022
… first invalid value (#11524)
Fixes the datepicker not adding the `matDatepickerParse` error if the user enters an invalid string as their first value. The issue comes from the fact that we don't call the function from the `ControlValueAccessor` if the value hasn't changed, which means that the validator won't be re-run.
Fixes#11523.
(cherry picked from commit 09a906a)
crapStone pushed a commit to Calciumdibromid/CaBr2 that referenced this pull request Mar 8, 2022
This PR contains the following updates:
| Package | Type | Update | Change |
|---|---|---|---|
| [@angular/cdk](https://github.com/angular/components) | dependencies | patch | [`13.2.4` -> `13.2.5`](https://renovatebot.com/diffs/npm/@angular%2fcdk/13.2.4/13.2.5) |
| [@angular/material](https://github.com/angular/components) | dependencies | patch | [`13.2.4` -> `13.2.5`](https://renovatebot.com/diffs/npm/@angular%2fmaterial/13.2.4/13.2.5) |
---
### Release Notes
<details>
<summary>angular/components</summary>
### [`v13.2.5`](https://github.com/angular/components/blob/HEAD/CHANGELOG.md#&#8203;1325-satin-sash-2022-03-02)
[Compare Source](angular/components@13.2.4...13.2.5)
##### cdk
| Commit | Type | Description |
| -- | -- | -- |
| [9e34a0f69f](angular/components@9e34a0f) | fix | **drag-drop:** error if preview dimensions are accessed too early ([#&#8203;24498](angular/components#24498)) |
| [9be3c46b01](angular/components@9be3c46) | fix | **testing:** TestElement sendKeys method should throw if no keys have been specified ([#&#8203;18271](angular/components#18271)) |
| [8e57a89cba](angular/components@8e57a89) | perf | **overlay:** add event listeners for overlay dispatchers outside of zone ([#&#8203;24408](angular/components#24408)) |
##### material
| Commit | Type | Description |
| -- | -- | -- |
| [ed2f516401](angular/components@ed2f516) | fix | **autocomplete:** auto-highlighted first option not display correctly if the floating label is disabled ([#&#8203;14507](angular/components#14507)) |
| [502102116e](angular/components@5021021) | fix | **autocomplete:** don't block default arrow keys when using modifiers ([#&#8203;11987](angular/components#11987)) |
| [f31fd3f066](angular/components@f31fd3f) | fix | **autocomplete:** reopen panel on input click ([#&#8203;16020](angular/components#16020)) |
| [5a79042d7d](angular/components@5a79042) | fix | **button-toggle:** use solid border color ([#&#8203;14253](angular/components#14253)) |
| [e2d4eecfcb](angular/components@e2d4eec) | fix | **checkbox:** inconsistent disabled color ([#&#8203;23083](angular/components#23083)) |
| [005ec323de](angular/components@005ec32) | fix | **checkbox:** incorrect text color when placed inside an overlay with a dark theme ([#&#8203;19054](angular/components#19054)) |
| [d7cbd1315f](angular/components@d7cbd13) | fix | **datepicker:** matDatepickerParse error not being added on first invalid value ([#&#8203;11524](angular/components#11524)) |
| [046022f31d](angular/components@046022f) | fix | **datepicker:** use aria-live over cdkAriaLive on period button ([#&#8203;24398](angular/components#24398)) |
| [37f69dbf7e](angular/components@37f69db) | fix | **dialog:** use passed in ComponentFactoryResolver to resolve dialog content ([#&#8203;17710](angular/components#17710)) |
| [2e15f54a9f](angular/components@2e15f54) | fix | **menu:** focus lost if active item is removed ([#&#8203;14039](angular/components#14039)) |
| [ea07fa8e64](angular/components@ea07fa8) | fix | **progress-spinner:** unable to change mode on spinner directive ([#&#8203;14514](angular/components#14514)) |
| [1a498a6a81](angular/components@1a498a6) | fix | **sort:** remove role from header when disabled ([#&#8203;24477](angular/components#24477)) |
| [72019531db](angular/components@7201953) | fix | **tooltip:** don't hide when pointer moves to tooltip ([#&#8203;24475](angular/components#24475)) |
##### material-experimental
| Commit | Type | Description |
| -- | -- | -- |
| [7b85cc077c](angular/components@7b85cc0) | fix | **mdc-button:** density styles being overwritten by structural styles ([#&#8203;22736](angular/components#22736)) |
| [aeb1426e4c](angular/components@aeb1426) | fix | **mdc-chips:** expose avatar harness ([#&#8203;24499](angular/components#24499)) |
#### Special Thanks
Andrew Seguin, Artur Androsovych, Jeri Peier, Kristiyan Kostadinov, Paul Gschwendtner, Yousaf Nawaz and Zach Arend
<!-- CHANGELOG SPLIT MARKER -->
</details>
---
### Configuration
📅 **Schedule**: At any time (no schedule defined).
🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied.
♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.
🔕 **Ignore**: Close this PR and you won't be reminded about these updates again.
---
- [ ] <!-- rebase-check -->If you want to rebase/retry this PR, click this checkbox.
---
This PR has been generated by [Renovate Bot](https://github.com/renovatebot/renovate).
Co-authored-by: cabr2-bot <cabr2.help@gmail.com>
Reviewed-on: https://codeberg.org/Calciumdibromid/CaBr2/pulls/1199
Reviewed-by: Epsilon_02 <epsilon_02@noreply.codeberg.org>
Co-authored-by: Calciumdibromid Bot <cabr2_bot@noreply.codeberg.org>
Co-committed-by: Calciumdibromid Bot <cabr2_bot@noreply.codeberg.org>
@angular-automatic-lock-bot

Copy link
Copy Markdown

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-botangular-automatic-lock-botBot locked and limited conversation to collaborators Mar 29, 2022
Sign up for freeto subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

action: mergeThe PR is ready for merge by the caretakerP3An issue that is relevant to core functions, but does not impede progress. Important, but not urgenttarget: patchThis PR is targeted for the next patch release

Projects

None yet

Development

Successfully merging this pull request may close these issues.

DatePicker "matDatepickerParse" validator not working on first time value change.

5 participants

@crisbeto@raysuelzer@mmalerba@googlebot@andrewseguin