Skip to content

[Dropdown] Multiple Selection causes infinite loop in Vue projects #3382

@Kingo64

Description

@Kingo64

Bug Report

Regression from v2.9.3. When using a multiple selection dropdown an infinite loop occurs when selecting a dropdown value when using Fomantic UI in a Vue project.

If I were to guess the cause I'd say that it seems that this issue was introduced by #3000.

Adding preventChangeTrigger = true; before the following line seems to resolve the infinite loop:
module.remove.labels($module.find(selector.label), true);

Steps to reproduce

  1. Create a multiple select dropdown field in a Vue project initialised from a <select> element
  2. Try to select a value

Expected result

You are able to select values correctly and the selected value will update.

Actual result

It causes an infinite loop.

Testcase

Broken: v2.9.4 https://jsfiddle.net/6f7jyskh/
Working: v2.9.3 https://jsfiddle.net/qg2hfmz5/

Note: You may need to reload the jsfiddles if the dropdown doesn't load correctly. I wasn't entirely sure how to get jquery and Fomantic UI working in a fiddle properly with Vue lifecycle events (mounted()) so I used a hacky setTimeout(). I hope it still illustrates the problem.

Screenshot (if possible)

n/a

Version

2.9.4

Metadata

Metadata

Assignees

No one assigned

    Labels

    state/fixed in next-release/nightlyAny issue which has a corresponding PR which has been merged and is available in the nightly buildtype/bugAny issue which is a bug or PR which fixes a bug

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions