fix(datetime): presentation time emits ionChange once

[sean-perkins]

Pull request checklist

Please check if your PR fulfills the following requirements:

• Tests for the changes have been added (for bug fixes / features)
• Docs have been reviewed and added / updated if needed (for bug fixes / features)
• Build (npm run build) was run locally and any changes were pushed
• Lint (npm run lint) has passed locally and any fixes were made for failures

Pull request type

Please check the type of change your PR introduces:

• Bugfix
• Feature
• Code style update (formatting, renaming)
• Refactoring (no functional changes, no api changes)
• Build related changes
• Documentation content changes
• Other (please describe):

What is the current behavior?

When modifying the value of an ion-datetime[presentation="time"] with the picker wheel visible in the viewport; the datetime component will emit 4 ionChange events, resulting in an incorrect value and in Angular, an incorrect display of the picker wheel.

For example, when setting the value to 06:02:40, the emitted events will be:

{ value: '06:02:40' }
{ value: '2022-03-20T06:57:00-04:00' }
{ value: '2022-03-20T00:02:00-04:00' }
{ value: '00:02' }

This corresponds to:

• The first emission is the ion-datetime watch callback for the value being modified/ionChange.
• The second emission is the ion-picker-column-internal hour column detecting a change/modifying the value.
• The third emission is the ion-picker-column-internal minute column detecting a change/modifying the value.
• The fourth emission is the ion-picker-column-internal am/pm column detecting a change/modifying the value.

Issue URL: #24967

What is the new behavior?

ion-datetime[presentation="time"] will only emit a single ionChange event when the value is modified, regardless if the picker wheel is visible in the viewport or not.

This results in the value correctly reflecting the new datetime value and the display of the component to be correct.

The ion-picker-column-internal will not emit ionChange events when the value is modified externally. It will only emit change events as a result of selecting a new value or the fallback setting the initial value.

Does this introduce a breaking change?

• Yes
• No

Other information

[liamdebeasi]

Suggested change

	expect(ionChangeSpy).not.toHaveReceivedEvent();
	expect(ionChangeSpy).toHaveReceivedEvent();

[sean-perkins]

Great catch, I also needed to wait for the event:

await ionChangeSpy.next();

expect(ionChangeSpy).toHaveReceivedEvent();

Confirmed this test passed with the changes and failed against main. I'll wait for CI before finally merging.

[liamdebeasi]

Good to merge once test is fixed