Skip to content

[Dropdown] multiselect values encoding, label cannot be removed, quotes missing in select dropdown#1770

Merged
lubber-de merged 4 commits intofomantic:developfrom
lubber-de:fix/1373/dropdownMultiInputEncode
Nov 16, 2020
Merged

[Dropdown] multiselect values encoding, label cannot be removed, quotes missing in select dropdown#1770
lubber-de merged 4 commits intofomantic:developfrom
lubber-de:fix/1373/dropdownMultiInputEncode

Conversation

@lubber-de
Copy link
Copy Markdown
Member

@lubber-de lubber-de commented Nov 15, 2020

Description

When a multiple dropdown (non select) was used and selected data has characters like & or ' set, there were stored entity encoded (returning into false positives when comparing later to their original values). Even worse this was only done for all previous selected values, the current to be added value was kept raw already. dropdowns using select tags do not store the selected data in an input field, so the issue does not happen there.

Original data should be kept, as it is already the case for dropdown made out of select tags. Also SUI does not do this.

Additionally this PR fixes a situation when a value has double quotes which led to a js error when trying to remove that label .
Double quotes in select menus are now also kept encoded instead of being removed to have the same behavior for select/non select dropdowns

Double quotes are always encoded (when text needs to be kept) or removed (everywhere else where they dont make sense like classnames) for security reasons, because all internal templates use them for HTML generation

Testcase

  • Try to select the entries with a & or '
  • Watch the hidden inputs content after every selection in the elements console
  • Try to remove the Item 3" inches label in the first dropdown

Wrong

  • While selecting each previous value gets encoded making it different to the original value
  • Trying to remove the Item 3" inches label results in a console syntax error
  • The second dropdown, made out of a select, does not show the " inside the Item 3 label anymore
    https://jsfiddle.net/lubber/fL56791d/13/

Correct

Screenshots

To see the difference look at the elements console for the hidden input tag holding the selected data. Each time a selected value is added the previous values are encoded.
The second dropdown is made out of a selected tag which works fine already

Wrong

image
image

Correct

image
image

Closes

#1373

@lubber-de lubber-de added type/bug Any issue which is a bug or PR which fixes a bug lang/javascript Anything involving JavaScript state/awaiting-reviews Pull requests which are waiting for reviews labels Nov 15, 2020
@lubber-de lubber-de added this to the 2.8.8 milestone Nov 15, 2020
Copy link
Copy Markdown
Member

@ko2in ko2in left a comment

Choose a reason for hiding this comment

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

LGTM.

Copy link
Copy Markdown
Contributor

@prudho prudho left a comment

Choose a reason for hiding this comment

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

Woa, good catch ! This one was a nasty bug.

LGTM 👍

@lubber-de lubber-de merged commit 19806d4 into fomantic:develop Nov 16, 2020
@lubber-de lubber-de deleted the fix/1373/dropdownMultiInputEncode branch November 16, 2020 18:26
@lubber-de lubber-de removed the state/awaiting-reviews Pull requests which are waiting for reviews label Nov 16, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

lang/javascript Anything involving JavaScript type/bug Any issue which is a bug or PR which fixes a bug

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants