Improve option property handling

jacobmllr95 · jacobmllr95 · commit b47a94d6f0ba · 2019-10-17T01:55:40.000+02:00
diff --git a/src/components/form-select/form-select-option-group.js b/src/components/form-select/form-select-option-group.js
@@ -18,8 +18,15 @@ const BFormSelectOptionGroup = /*#__PURE__*/ Vue.extend({
     return h('optgroup', { attrs: { label: this.label } }, [
       this.normalizeSlot('first'),
       this.formOptions.map((option, index) => {
-        const tag = isArray(option.options) ? BFormSelectOptionGroup : BFormSelectOption
-        return h(tag, { props: option, key: `option_${index}_opt` })
+        const key = `option_${index}_opt`
+        const options = option.options
+        return isArray(options)
+          ? h(BFormSelectOptionGroup, { props: { label: option.label, options }, key })
+          : h(
+              BFormSelectOption,
+              { props: { value: option.value, disabled: option.disabled }, key },
+              option.html || option.text
+            )
       }),
       this.normalizeSlot('default')
     ])
diff --git a/src/components/form-select/form-select-option.js b/src/components/form-select/form-select-option.js
@@ -1,6 +1,5 @@
 import Vue from '../../utils/vue'
 import { mergeData } from 'vue-functional-data-merge'
-import { htmlOrText } from '../../utils/html'
 
 const NAME = 'BFormSelectOption'
 
@@ -9,14 +8,6 @@ export const props = {
     // type: [String, Number, Boolean, Object],
     required: true
   },
-  text: {
-    type: String,
-    default: null
-  },
-  html: {
-    type: String,
-    default: null
-  },
   disabled: {
     type: Boolean,
     default: false
@@ -28,14 +19,15 @@ export const BFormSelectOption = /*#__PURE__*/ Vue.extend({
   name: NAME,
   functional: true,
   props,
-  render(h, { props, data }) {
-    const { value, text, html, disabled } = props
+  render(h, { props, data, children }) {
+    const { value, disabled } = props
     return h(
       'option',
       mergeData(data, {
         attrs: { disabled },
-        domProps: { ...htmlOrText(html, text), value }
-      })
+        domProps: { value }
+      }),
+      children
     )
   }
 })
diff --git a/src/components/form-select/form-select.js b/src/components/form-select/form-select.js
@@ -129,8 +129,15 @@ export const BFormSelect = /*#__PURE__*/ Vue.extend({
       [
         this.normalizeSlot('first'),
         this.formOptions.map((option, index) => {
-          const tag = isArray(option.options) ? BFormSelectOptionGroup : BFormSelectOption
-          return h(tag, { props: option, key: `option_${index}_opt` })
+          const key = `option_${index}_opt`
+          const options = option.options
+          return isArray(options)
+            ? h(BFormSelectOptionGroup, { props: { label: option.label, options }, key })
+            : h(
+                BFormSelectOption,
+                { props: { value: option.value, disabled: option.disabled }, key },
+                option.html || option.text
+              )
         }),
         this.normalizeSlot('default')
       ]
diff --git a/src/mixins/form-options.js b/src/mixins/form-options.js
@@ -1,5 +1,6 @@
 import warn from '../utils/warn'
 import { isArray, isPlainObject, isUndefined } from '../utils/inspect'
+import { stripTags } from '../utils/html'
 import { keys } from '../utils/object'
 
 const DEPRECATED_MSG =
@@ -50,15 +51,15 @@ export default {
         const text = option[this.textField]
         return {
           value: isUndefined(value) ? key || text : value,
-          text: String(isUndefined(text) ? key : text),
+          text: stripTags(String(isUndefined(text) ? key : text)),
           html: option[this.htmlField],
           disabled: Boolean(option[this.disabledField])
         }
       }
       // Otherwise create an `<option>` object from the given value
       return {
         value: key || option,
-        text: String(option),
+        text: stripTags(String(option)),
         disabled: false
       }
     }

Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,6 @@`
`1`	`1`	`import warn from '../utils/warn'`
`2`	`2`	`import { isArray, isPlainObject, isUndefined } from '../utils/inspect'`
	`3`	`+import { stripTags } from '../utils/html'`
`3`	`4`	`import { keys } from '../utils/object'`
`4`	`5`
`5`	`6`	`const DEPRECATED_MSG =`
`@@ -50,15 +51,15 @@ export default {`
`50`	`51`	`const text = option[this.textField]`
`51`	`52`	`return {`
`52`	`53`	`value: isUndefined(value) ? key \|\| text : value,`
`53`		`- text: String(isUndefined(text) ? key : text),`
	`54`	`+ text: stripTags(String(isUndefined(text) ? key : text)),`
`54`	`55`	`html: option[this.htmlField],`
`55`	`56`	`disabled: Boolean(option[this.disabledField])`
`56`	`57`	`}`
`57`	`58`	`}`
`58`	`59`	// Otherwise create an `<option>` object from the given value
`59`	`60`	`return {`
`60`	`61`	`value: key \|\| option,`
`61`		`- text: String(option),`
	`62`	`+ text: stripTags(String(option)),`
`62`	`63`	`disabled: false`
`63`	`64`	`}`
`64`	`65`	`}`