Fix placeholder not configurable for fieldRplSelect (#601)

* Adds placeholder for rplselect field * fix rpl-select error with no options * update snapshots
dpc-sdp · Nov 26, 2019 · 57f7cae · 57f7cae
1 parent aa77038
commit 57f7cae
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 21 deletions.
diff --git a/packages/components/Molecules/Form/Select.vue b/packages/components/Molecules/Form/Select.vue
@@ -228,23 +228,25 @@ export default {
       return false
     },
     focusItem (selected) {
-      this.focussed = selected
-      const item = this.$el.querySelector(`#${selected.uuid}`)
-      const listbox = this.$refs.listbox
+      if (selected) {
+        this.focussed = selected
+        const item = this.$el.querySelector(`#${selected.uuid}`)
+        const listbox = this.$refs.listbox
 
-      if (listbox.scrollHeight > listbox.clientHeight) {
-        let scrollBottom = listbox.clientHeight + listbox.scrollTop
-        let elementBottom = item.offsetTop + item.offsetHeight
-        if (elementBottom > scrollBottom) {
-          listbox.scrollTop = elementBottom - listbox.clientHeight
-        } else if (item.offsetTop < listbox.scrollTop) {
-          listbox.scrollTop = item.offsetTop
+        if (listbox.scrollHeight > listbox.clientHeight) {
+          let scrollBottom = listbox.clientHeight + listbox.scrollTop
+          let elementBottom = item.offsetTop + item.offsetHeight
+          if (elementBottom > scrollBottom) {
+            listbox.scrollTop = elementBottom - listbox.clientHeight
+          } else if (item.offsetTop < listbox.scrollTop) {
+            listbox.scrollTop = item.offsetTop
+          }
+        }
+        if (item) {
+          this.$nextTick(function () {
+            item.focus()
+          })
         }
-      }
-      if (item) {
-        this.$nextTick(function () {
-          item.focus()
-        })
       }
     },
     handleKeys (e) {

diff --git a/packages/components/Molecules/Form/fields/fieldRplselect.vue b/packages/components/Molecules/Form/fields/fieldRplselect.vue
@@ -49,11 +49,8 @@ export default {
   computed: {
     config () {
       return {
-        multiselect: this.schema.multiselect,
-        placeholder: 'Select',
-        showitems: 4,
-        fieldId: this.getFieldID(this.schema),
-        label: ''
+        ...this.schema,
+        fieldId: this.getFieldID(this.schema)
       }
     }
   }

diff --git a/src/test/__snapshots__/storyshots.test.js.snap b/src/test/__snapshots__/storyshots.test.js.snap
@@ -5403,7 +5403,7 @@ exports[`RippleStoryshots Molecules/Form Default 1`] = `
                     disabled="disabled"
                     value=""
                   >
-                    Select
+                    Select a single topic
                   </option>
                    
                   <option