fix(head): case http-equiv correctly (#7190)

harlan-zw · web-flow · commit fe3fc34b1234 · 2022-09-03T14:31:09.000+02:00
diff --git a/packages/nuxt/src/head/runtime/components.ts b/packages/nuxt/src/head/runtime/components.ts
@@ -197,9 +197,17 @@ export const Meta = defineComponent({
     httpEquiv: String as PropType<HTTPEquiv>,
     name: String
   },
-  setup: setupForUseMeta(meta => ({
-    meta: [meta]
-  }))
+  setup: setupForUseMeta((props) => {
+    const meta = { ...props }
+    // fix casing for http-equiv
+    if (meta.httpEquiv) {
+      meta['http-equiv'] = meta.httpEquiv
+      delete meta.httpEquiv
+    }
+    return {
+      meta: [meta]
+    }
+  })
 })
 
 // <style>
diff --git a/test/basic.test.ts b/test/basic.test.ts
@@ -165,6 +165,12 @@ describe('head tags', () => {
     expect(indexHtml).toContain('<title>Basic fixture</title>')
   })
 
+  it('should render http-equiv correctly', async () => {
+    const html = await $fetch('/head')
+    // http-equiv should be rendered kebab case
+    expect(html).toContain('<meta content="default-src https" http-equiv="content-security-policy">')
+  })
+
   // TODO: Doesn't adds header in test environment
   // it.todo('should render stylesheet link tag (SPA mode)', async () => {
   //   const html = await $fetch('/head', { headers: { 'x-nuxt-no-ssr': '1' } })
diff --git a/test/fixtures/basic/pages/head.vue b/test/fixtures/basic/pages/head.vue
@@ -35,6 +35,7 @@ export default {
   <div>
     <Head>
       <Title>Using a dynamic component</Title>
+      <Meta http-equiv="content-security-policy" content="default-src https" />
     </Head>
   </div>
 </template>
