empty selects by default

Author: samuelcolvin

index.html

@@ -26,8 +26,8 @@
     </main>
   </body>
   <script>
-//    var public_key = 'f8d88b6562b3434ba4ef'
-    var public_key = '9c79f14df986a1ec693c'
+    var public_key = 'f8d88b6562b3434ba4ef'
+//    var public_key = '9c79f14df986a1ec693c'
     var api_root = null  // 'http://localhost:8000'
     var socket1 = socket(public_key, {
       element: '#socket1',

package.json

@@ -1,6 +1,6 @@
 {
   "name": "tutorcruncher-socket",
-  "version": "0.0.13",
+  "version": "0.0.14",
   "description": "TutorCruncher socket",
   "author": "Samuel Colvin <[email protected]>",
   "private": false,

src/components/input.vue

@@ -18,6 +18,7 @@
     <label v-else-if="field.type === 'select'">
       {{ label }}
       <select :name="name" :required="field.required" @input="changed">
+        <option value="">---------</option>
         <option v-for="choice in field.choices" :value="choice.value" :selected="choice.value === value">
           {{ choice.display_name }}
         </option>
@@ -40,7 +41,10 @@
 </template>
 
 <script>
+import Multiselect from 'vue-multiselect'
+
 export default {
+  components: { Multiselect },
   props: {
     field: Object,
   },

test/unit/specs/_shared.js

@@ -28,6 +28,25 @@ const enquiry_options = {
   visible: [
     {field: 'first_field', prefix: null, type: 'text', label: 'Foobar', max_length: 255},
     {field: 'custom_field', prefix: 'attributes', type: 'text', label: 'Custom Field', max_length: 2047},
+    {
+      field: 'select_test',
+      choices: [
+        {
+          display_name: 'v1',
+          value: 'v1'
+        },
+        {
+          display_name: 'v2',
+          value: 'v2'
+        }
+      ],
+      help_text: 'xxx',
+      label: 'Select Test',
+      prefix: 'attributes',
+      required: true,
+      sort_index: 1000,
+      type: 'select'
+    },
   ],
 }
 

test/unit/specs/enquiry.js

@@ -37,9 +37,19 @@ describe('con-modal.vue, enquiry.vue', () => {
     vm.$el.querySelector('textarea').value = 'X'
     vm.$el.querySelector('textarea').dispatchEvent(new window.Event('input'))
 
+    vm.$el.querySelector('select').options[2].selected = true
+    vm.$el.querySelector('select').dispatchEvent(new window.Event('input'))
+
     await tick()
     expect(vm.$el.querySelector('input').value).to.equal('the new value')
-    expect(vm.enquiry_data).to.deep.equal({first_field: 'the new value', attributes: {custom_field: 'X'}})
+    console.log(vm.enquiry_data)
+    expect(vm.enquiry_data).to.deep.equal({
+      first_field: 'the new value',
+      attributes: {
+        custom_field: 'X',
+        select_test: 'v2'
+      }
+    })
 
     expect(vm.method_calls['submit_enquiry']).to.equal(undefined)
     vm.$el.querySelector('form').dispatchEvent(new window.Event('submit'))