Merge pull request #394 from CVEProject/tat-39-40

Tat #39 #40 fixes from NPO test results

Author: Nick-P-Orr

src/components/cveRecordLookupModule.vue

@@ -2,7 +2,7 @@
   <div class="field mt-1" style="">
     <div class="field has-addons mb-1">
       <div class="control is-expanded">
-        <input v-model="cveId" @keyup.enter="lookupId" @keyup="validateCveId" @blur="removeHelpText" type="text" class="input cve-id-input"
+        <input v-model="cveId" @keyup.enter="onKeyUpEnter" @keyup="validateCveId" @blur="removeHelpText" type="text" class="input cve-id-input"
           placeholder="Enter CVE ID (CVE-YYYY-NNNN)"/>
       </div>
       <div class="control">
@@ -303,6 +303,11 @@ export default ({
 
       this.formatCveRecord();
     },
+    onKeyUpEnter() {
+      this.validateCveId();
+
+      if (!this.disabled) this.lookupId();
+    },
   },
 });
 </script>

src/views/CVERecord.vue

@@ -36,24 +36,25 @@
                 <section class="cve-accordian">
                   <div class="message">
                     <div class="message-header cve-base-light-gray-borders-bg">
-                      <p style="margin-top: auto !important; margin-bottom: auto !important">{{showRecord ? 'Hide' : 'View'}} full JSON 4.0 record</p>
-                      <button class="button" @click="toggleRecord" :aria-expanded="!true ? 'true' : 'false'" aria-controls="cve-id">
+                      <p style="margin-top: auto !important; margin-bottom: auto !important">
+                        {{this.$store.state.showJsonRecord ? 'Hide' : 'View'}} full JSON 4.0 record
+                      </p>
+                      <button class="button" @click="toggleRecord"
+                        :aria-expanded="!this.$store.state.showJsonRecord ? 'true' : 'false'" aria-controls="cve-id">
                         <span class="icon is-small">
                           <p id="cve-id-alttext" class="is-hidden">
                             {{true ? 'collapse' : 'expand'}}
                           </p>
-                          <font-awesome-icon :icon="showRecord ? 'minus' : 'plus'"
+                          <font-awesome-icon :icon="this.$store.state.showJsonRecord ? 'minus' : 'plus'"
                           aria-hidden="false" focusable="true" aria-labelledby="cve-id-alttext"/>
                         </span>
                       </button>
                     </div>
                     <div class="message-body pb-0" :class="{'is-hidden': false}" id="cve-id">
-                      <div class="block">
-                        <pre :class="[{'is-hidden': !showRecord}]" v-html="$sanitize(JSON.stringify(this.$store.state.recordData, null, 2))"></pre>
-                      </div>
+                      <pre :class="[{'is-hidden': !this.$store.state.showJsonRecord}]"
+                        v-html="$sanitize(JSON.stringify(this.$store.state.recordData, null, 2))"></pre>
                     </div>
                   </div>
-                  <pre :class="[{'is-hidden': !showRecord}]" v-html="$sanitize(JSON.stringify(this.$store.state.recordData, null, 2))"></pre>
                 </section>
                 <div class="cve-scrollx-table-container">
                   <table class="table is-striped is-hoverable cve-border-dark-blue">
@@ -117,7 +118,7 @@
                           <ul v-for="reference in this.$store.state.recordData.reference_data" :key="reference.index">
                             <li v-if="reference.url !== undefined" class="cve-task-tile-list-item">
                               <a :href="$sanitize(reference.url)" class="cve-word-wrap" target="_blank">
-                                {{reference.name === undefined ? $sanitize(reference.url) : $sanitize(reference.name)}}
+                                {{$sanitize(reference.url)}}
                               </a>
                             </li>
                           </ul>
@@ -151,14 +152,9 @@
 <script>
 export default {
   name: 'CVERecord',
-  data() {
-    return {
-      showRecord: false,
-    };
-  },
   methods: {
     toggleRecord() {
-      this.showRecord = !this.showRecord;
+      this.$store.commit('updateState', { showJsonRecord: !this.$store.state.showJsonRecord });
     },
   },
 };