Update tests and formatting

- add changelog

ee/app/assets/javascripts/threat_monitoring/components/policy_editor/policy_drawer.vue

@@ -17,14 +17,22 @@ export default {
     },
   },
   computed: {
+    canHumanizePolicy() {
+      console.log('to/from', toYaml(fromYaml(this.value)));
+      console.log('original', this.value);
+      return this.value.includes(toYaml(fromYaml(this.value)));
+    },
+    initialTab() {
+      return this.canHumanizePolicy ? 1 : 0;
+    },
     policy() {
-      return fromYaml(this.value);
+      return this.canHumanizePolicy ? fromYaml(this.value) : null;
     },
     humanizedPolicy() {
-      return humanizeNetworkPolicy(this.policy);
+      return this.canHumanizePolicy ? humanizeNetworkPolicy(this.policy) : null;
     },
     policyYaml() {
-      return toYaml(this.policy);
+      return this.value;
     },
   },
   methods: {
@@ -43,12 +51,14 @@ export default {
     <h5 class="gl-mt-6">{{ s__('NetworkPolicies|Policy type') }}</h5>
     <p>{{ s__('NetworkPolicies|Network Policy') }}</p>
 
-    <h5 class="gl-mt-6">{{ s__('NetworkPolicies|Description') }}</h5>
-    <gl-form-textarea :value="policy.description" @input="updateManifest" />
+    <div v-if="canHumanizePolicy">
+      <h5 class="gl-mt-6">{{ s__('NetworkPolicies|Description') }}</h5>
+      <gl-form-textarea :value="policy.description" @input="updateManifest" />
+    </div>
 
     <policy-preview
       class="gl-mt-4"
-      :initial-tab="1"
+      :initial-tab="initialTab"
       :policy-yaml="policyYaml"
       :policy-description="humanizedPolicy"
     />

ee/app/assets/javascripts/threat_monitoring/components/policy_editor/policy_preview.vue

 <script>
-import { GlTabs, GlTab, GlSafeHtmlDirective } from '@gitlab/ui';
+import { GlAlert, GlTabs, GlTab, GlSafeHtmlDirective } from '@gitlab/ui';
 
 export default {
   components: {
+    GlAlert,
     GlTabs,
     GlTab,
   },
@@ -16,7 +17,8 @@ export default {
     },
     policyDescription: {
       type: String,
-      required: true,
+      required: false,
+      default: '',
     },
     initialTab: {
       type: Number,
@@ -40,9 +42,15 @@ export default {
     </gl-tab>
     <gl-tab :title="s__('NetworkPolicies|Rule')">
       <div
+        v-if="policyDescription"
         v-safe-html:[$options.safeHtmlConfig]="policyDescription"
         class="gl-bg-white gl-rounded-top-left-none gl-rounded-top-right-none gl-rounded-bottom-left-base gl-rounded-bottom-right-base gl-py-3 gl-px-4 gl-border-1 gl-border-solid gl-border-gray-100"
       ></div>
+      <div v-else>
+        <gl-alert variant="info" :dismissible="false"
+          >{{ s__('NetworkPolicies|Unsupported attribute') }}
+        </gl-alert>
+      </div>
     </gl-tab>
   </gl-tabs>
 </template>

ee/changelogs/unreleased/271169-update-yaml-parsing.yml

+---
+title: Throw an error when yaml mode contains unparsable attributes
+merge_request: 54987
+author:
+type: fixed

locale/gitlab.pot

@@ -20790,6 +20790,9 @@ msgstr ""
 msgid "NetworkPolicies|Unable to parse policy"
 msgstr ""
 
+msgid "NetworkPolicies|Unsupported attribute"
+msgstr ""
+
 msgid "NetworkPolicies|YAML editor"
 msgstr ""