Handle both mimeType and mimetype in REST responses. (#801)

While `mimeType` is the correct spelling of this data in the Render Node
JSON specification, there may be data providers mistakenly using the
`mimetype` spelling, so this change allows the renderer to handle both
spellings as a temporary workaround until all providers are using the
correct spelling.

Resolves: rdar://124300035

Author: mportiz08

src/components/DocumentationTopic/PrimaryContent/RestResponses.vue

@@ -11,7 +11,7 @@
 <template>
   <section>
     <LinkableHeading :anchor="anchor">{{ title }}</LinkableHeading>
-    <ParametersTable :parameters="responses" :changes="propertyChanges" key-by="status">
+    <ParametersTable :parameters="sanitizedResponses" :changes="propertyChanges" key-by="status">
       <template #symbol="{ status, type, reason, content, changes }">
         <div class="response-name">
           <code>
@@ -26,7 +26,7 @@
         />
       </template>
       <template
-        #description="{ content, mimetype, reason, type, status, changes }"
+        #description="{ content, mimeType, reason, type, status, changes }"
       >
         <PossiblyChangedType
           v-if="shouldShiftType({content, reason, status})"
@@ -38,8 +38,8 @@
         </div>
         <ContentNode v-if="content" :content="content" />
         <PossiblyChangedMimetype
-          v-if="mimetype"
-          :mimetype="mimetype"
+          v-if="mimeType"
+          :mimetype="mimeType"
           :changes="changes.mimetype"
           :change="changes.change"
         />
@@ -81,8 +81,15 @@ export default {
   computed: {
     anchor: ({ title }) => anchorize(title),
     propertyChanges: ({ apiChanges }) => ((apiChanges || {}).restResponses),
+    sanitizedResponses: ({ responses, sanitizeResponse }) => responses.map(sanitizeResponse),
   },
   methods: {
+    // ensure that mimetype data gets handled correctly, regardless of its
+    // spelling in the JSON (`mimeType` is the expected spelling, but some
+    // data sources may be encoded as `mimetype` at present)
+    sanitizeResponse: ({ mimetype, ...response }) => (mimetype
+      ? ({ ...response, mimeType: mimetype })
+      : response),
     shouldShiftType:
       ({ content = [], reason, status }) => (!(content.length || reason) && status),
   },

tests/unit/components/DocumentationTopic/PrimaryContent/RestResponses.spec.js

@@ -28,7 +28,7 @@ describe('RestResponses', () => {
       {
         status: '200',
         reason: 'OK',
-        mimetype: 'application/json',
+        mimeType: 'application/json',
         type: [
           {
             kind: 'identifier',
@@ -99,7 +99,7 @@ describe('RestResponses', () => {
   });
 
   it('hides mime-type if absent', () => {
-    const { mimetype, ...otherProps } = propsData.responses[0];
+    const { mimeType, ...otherProps } = propsData.responses[0];
     const wrapper = mountComponent({
       propsData: {
         ...propsData,
@@ -262,4 +262,23 @@ describe('RestResponses', () => {
     expect(wrapper.find(PossiblyChangedType).props()).toHaveProperty('changes', changes['200'].type);
     expect(wrapper.find(PossiblyChangedMimetype).props()).toMatchObject({ changes: changes['200'].mimetype, change: changes['200'].change });
   });
+
+  it('handles data where `mimetype` spelling is used instead of `mimeType`', () => {
+    const { mimetype, mimeType, ...firstResponse } = propsData.responses[0];
+
+    expect(mimeType).not.toBeUndefined();
+    expect(mimetype).toBeUndefined();
+    const wrapper = mountComponent({
+      propsData: {
+        ...propsData,
+        responses: [
+          {
+            ...firstResponse,
+            mimetype: mimeType,
+          },
+        ],
+      },
+    });
+    expect(wrapper.find(PossiblyChangedMimetype).exists()).toBe(true);
+  });
 });