From b068488f2096ae03f114045e7e9b016583109efb Mon Sep 17 00:00:00 2001 From: philippe Date: Thu, 23 Jun 2022 13:51:11 -0400 Subject: [PATCH 1/4] Add test dropdown dynamic value search --- .../dropdown/test_dynamic_options.py | 46 +++++++++++++++++++ 1 file changed, 46 insertions(+) diff --git a/components/dash-core-components/tests/integration/dropdown/test_dynamic_options.py b/components/dash-core-components/tests/integration/dropdown/test_dynamic_options.py index ed71593db0..87fc3ac5f5 100644 --- a/components/dash-core-components/tests/integration/dropdown/test_dynamic_options.py +++ b/components/dash-core-components/tests/integration/dropdown/test_dynamic_options.py @@ -1,3 +1,7 @@ +import time + +from selenium.webdriver import Keys + from dash import Dash, Input, Output, dcc, html from dash.exceptions import PreventUpdate @@ -81,3 +85,45 @@ def test_dddo003_value_no_options(dash_dcc): dash_dcc.start_server(app) assert dash_dcc.get_logs() == [] dash_dcc.wait_for_element("#dropdown") + + +def test_dddo004_dynamic_value_search(dash_dcc): + # Bug clear the search input while typing + # https://github.com/plotly/dash/issues/2099 + + options = [ + {"label": "aa1", "value": "aa1"}, + {"label": "aa2", "value": "aa2"}, + {"label": "aa3", "value": "aa3"}, + {"label": "best value", "value": "bb1"}, + {"label": "better value", "value": "bb2"}, + {"label": "bye", "value": "bb3"}, + ] + + app = Dash(__name__) + app.layout = html.Div( + [ + html.Div( + ["Single dynamic Dropdown", dcc.Dropdown(id="dropdown")], + style={"width": 200, "marginLeft": 20, "marginTop": 20}, + ), + ] + ) + + @app.callback(Output("dropdown", "options"), Input("dropdown", "search_value")) + def update_options(search_value): + if not search_value: + raise PreventUpdate + return [o for o in options if search_value in o["label"]] + + dash_dcc.start_server(app) + + input_ = dash_dcc.find_element("#dropdown input") + + input_.send_keys("aa1") + input_.send_keys(Keys.ENTER) + + input_.send_keys("b") + + time.sleep(1) + assert input_.get_attribute("value") == "b" From 8766c21b00b28a2e5ee294721faa737b0c301a43 Mon Sep 17 00:00:00 2001 From: philippe Date: Thu, 23 Jun 2022 13:52:47 -0400 Subject: [PATCH 2/4] Fix dropdown search value resetting when a value is selected. --- components/dash-core-components/src/fragments/Dropdown.react.js | 2 ++ .../tests/integration/dropdown/test_remove_option.py | 2 ++ 2 files changed, 4 insertions(+) diff --git a/components/dash-core-components/src/fragments/Dropdown.react.js b/components/dash-core-components/src/fragments/Dropdown.react.js index ef69462339..f422718d6f 100644 --- a/components/dash-core-components/src/fragments/Dropdown.react.js +++ b/components/dash-core-components/src/fragments/Dropdown.react.js @@ -37,6 +37,7 @@ const Dropdown = props => { const { id, clearable, + searchable, multi, options, setProps, @@ -86,6 +87,7 @@ const Dropdown = props => { useEffect(() => { if ( + !searchable && !isNil(sanitizedOptions) && optionsCheck !== sanitizedOptions && !isNil(value) diff --git a/components/dash-core-components/tests/integration/dropdown/test_remove_option.py b/components/dash-core-components/tests/integration/dropdown/test_remove_option.py index f56371b6ab..6986380b45 100644 --- a/components/dash-core-components/tests/integration/dropdown/test_remove_option.py +++ b/components/dash-core-components/tests/integration/dropdown/test_remove_option.py @@ -22,6 +22,7 @@ def test_ddro001_remove_option_single(dash_dcc): dcc.Dropdown( options=dropdown_options, value=value, + searchable=False, id="dropdown", ), html.Button("Remove option", id="remove"), @@ -61,6 +62,7 @@ def test_ddro002_remove_option_multi(dash_dcc): value=value, multi=True, id="dropdown", + searchable=False, ), html.Button("Remove option", id="remove"), html.Div(id="value-output"), From 2fc121de08ae7a71fafbbeab14c423c39ff7d221 Mon Sep 17 00:00:00 2001 From: philippe Date: Thu, 23 Jun 2022 15:04:01 -0400 Subject: [PATCH 3/4] fix import. --- .../tests/integration/dropdown/test_dynamic_options.py | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/dash-core-components/tests/integration/dropdown/test_dynamic_options.py b/components/dash-core-components/tests/integration/dropdown/test_dynamic_options.py index 87fc3ac5f5..2a4fc1f0ae 100644 --- a/components/dash-core-components/tests/integration/dropdown/test_dynamic_options.py +++ b/components/dash-core-components/tests/integration/dropdown/test_dynamic_options.py @@ -1,6 +1,6 @@ import time -from selenium.webdriver import Keys +from selenium.webdriver.common.keys import Keys from dash import Dash, Input, Output, dcc, html from dash.exceptions import PreventUpdate From f2d02f6803c7b690c4b979e1b024c9722524a582 Mon Sep 17 00:00:00 2001 From: philippe Date: Thu, 23 Jun 2022 15:14:55 -0400 Subject: [PATCH 4/4] Update changelog. --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 7431bca54d..ba887dc0e1 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,6 +8,7 @@ This project adheres to [Semantic Versioning](https://semver.org/). - [#2098](https://github.com/plotly/dash/pull/2098) Accept HTTP code 400 as well as 401 for JWT expiry - [#2097](https://github.com/plotly/dash/pull/2097) Fix bug [#2095](https://github.com/plotly/dash/issues/2095) with TypeScript compiler and `React.FC` empty valueDeclaration error & support empty props components. +- [#2104](https://github.com/plotly/dash/pull/2104) Fix bug [#2099](https://github.com/plotly/dash/issues/2099) with Dropdown clearing search value when a value is selected. ## [2.5.1] - 2022-06-13