Details component collapses when content is clicked in Edge, IE11

[36degrees]

From @andyjones1981 on July 15, 2018 8:46

The details component, when expanded, closes when the content is clicked on, rather than the link causing the close action.

This causes a problem when a user wants to select and copy the expanded text.

I am using this in a case tool which shows details of a message sent to an applicant, the case tool user might want to copy the update into another location but cannot do this.

On touch interfaces this does not occur and the text can be selected/copied without the panel closing.

I'll add that the Gov Elements version didn't close when text was selected.

Copied from original issue: alphagov/govuk-design-system-backlog#148

[36degrees]

Hi Andy,

Thanks for flagging this – can you confirm that you're seeing this behaviour with the examples in the Design System, not just in your application? Can I also check what browser you're using? I've not been able to reproduce this in Chrome 67 (running on macOS High Sierra)

Thanks,

Ollie

[36degrees]

From @andyjones1981 on July 16, 2018 19:20

@36degrees I just tested across IE11, Edge, FF and Chrome. Seems to be an issue isolated to IE11 and Edge only. I'll be honest I don't use chrome as my main browser, I use Edge. (Sorry should have x-tested first)

I can recreate in my service prototype as well as the example In the design system.

[36degrees]

Great, thanks. I'm going to move this issue to alphagov/govuk-frontend so we can track it there.

[36degrees]

@andyjones1981 a fix for this issue has been merged into master. We're hoping to get a bug fix release (v1.1.1) out today that will include it.