fix: fix bette #dropdown used in StrictMode support when value is given

dnbexperience · Feb 26, 2021 · 83739d6 · 83739d6
1 parent 0ad41f7
commit 83739d6
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 1 deletion.
diff --git a/packages/dnb-ui-lib/src/components/dropdown/__tests__/Dropdown.test.js b/packages/dnb-ui-lib/src/components/dropdown/__tests__/Dropdown.test.js
@@ -570,6 +570,25 @@ describe('Dropdown component', () => {
     ).toBe(true)
   })
 
+  it('will change the selected value when StrictMode is enabled', () => {
+    const Comp = mount(
+      <React.StrictMode>
+        <Component no_animation data={mockData} value={props.value} />
+      </React.StrictMode>
+    )
+
+    // first open
+    open(Comp)
+
+    // then simulate changes
+    keydown(Comp, 40) // down
+    keydown(Comp, 13) // enter
+
+    expect(Comp.find('.dnb-dropdown__text__inner').text()).toBe(
+      mockData[props.value + 1].selected_value
+    )
+  })
+
   it('has correct selected value', () => {
     const Comp = mount(<Component {...props} data={mockData} />)
     expect(Comp.find('.dnb-dropdown__text__inner').text()).toBe(

diff --git a/packages/dnb-ui-lib/src/fragments/drawer-list/DrawerListHelpers.js b/packages/dnb-ui-lib/src/fragments/drawer-list/DrawerListHelpers.js
@@ -263,7 +263,8 @@ export const prepareDerivedState = (props, state) => {
     if (
       typeof props.value !== 'undefined' &&
       props.value !== 'initval' &&
-      state.selected_item !== props.value
+      state.selected_item !== props.value &&
+      (state._value !== props.value || isTrue(props.prevent_selection))
     ) {
       state.selected_item = getCurrentIndex(props.value, state.data)
 
@@ -294,6 +295,7 @@ export const prepareDerivedState = (props, state) => {
       )
     }
   }
+  state._value = props.value
   state._listenForPropChanges = true
 
   return state