Skip to content

[button-toggle-group] ControlValueAccessor updates incorrectly when change event is preventDefault'd #115

@Alanoll

Description

@Alanoll

Describe the bug:
The component fires the event forge-button-toggle-group-change and checks if preventDefault is called. When it is, the component doesn't update its internal state and the value stays as the original.

The Angular library wires to the event to act as it's change notification and updates the Angular hooks with that new value.

If a consumer wires to the event, and calls preventDefault to cancel the change:

  • The component value is reset
  • The Angular control is not reset

To Reproduce:
Steps to reproduce the behavior:

  1. Have an Angular Form have a forge-button-toggle-group defined in it and bound
  2. Bind an event handler to the forge-button-toggle-group-change event
  3. Call preventDefault on the event
  4. Verify that the bound form control (not the Forge component) is correct
  • The bug causes it to update the value, instead of staying what it was

Expected behavior:
The ControlValueAccessor shouldn't trigger a change to the Angular infrastructure if the event has it's preventDefault method called by another handler.

Please complete the following information:

  • Package version: v5.5+ (the control value accessor hasn't changed in awhile)
  • I have searched existing issues before creating this report? Y
  • Browser: All
  • Platform: All
  • OS: All

Additional context:
Original internal Teams chat: https://teams.microsoft.com/l/message/19:cbdfaaed50d1412bb78e6b87158ccbc0@thread.tacv2/1770145350218?tenantId=7cc5f0f9-ee5b-4106-a62d-1b9f7be46118&groupId=2bb1b8ea-cd12-4df5-a4ab-0c895bfcda5c&parentMessageId=1770145350218&teamName=Forge&channelName=Components&createdTime=1770145350218

@DRiFTy17 suggested the solution may just be to await task(); in the ControlValueAccessor's event handler, and then inspecting the event reference's defaultPrevented property after awaiting before calling the onChange handler in the ControlValueAccessor

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions