fix(ssr): inheritAttrs false adds attributes to html (#11706)

vuejs · Mar 30, 2021 · 7e5dc6b · 7e5dc6b
1 parent e0274e4
commit 7e5dc6b
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 0 deletions.
diff --git a/src/platforms/web/server/modules/attrs.js b/src/platforms/web/server/modules/attrs.js
@@ -25,6 +25,10 @@ export default function renderAttrs (node: VNodeWithData): string {
   if (isUndef(opts) || opts.Ctor.options.inheritAttrs !== false) {
     let parent = node.parent
     while (isDef(parent)) {
+      // Stop fallthrough in case parent has inheritAttrs option set to false
+      if (parent.componentOptions && parent.componentOptions.Ctor.options.inheritAttrs === false) {
+        break;
+      }
       if (isDef(parent.data) && isDef(parent.data.attrs)) {
         attrs = extend(extend({}, attrs), parent.data.attrs)
       }

diff --git a/test/ssr/ssr-string.spec.js b/test/ssr/ssr-string.spec.js
@@ -1613,6 +1613,31 @@ describe('SSR: renderToString', () => {
       done()
     })
   })
+
+  it('Options inheritAttrs in parent component', done => {
+    const childComponent = {
+      template: `<div>{{ someProp }}</div>`,
+      props: {
+        someProp: {}
+      },
+    }
+    const parentComponent = {
+      template: `<childComponent v-bind="$attrs" />`,
+      components: { childComponent },
+      inheritAttrs: false
+    }
+    renderVmWithOptions({
+      template: `
+        <div>
+          <parentComponent some-prop="some-val" />
+        </div>
+        `,
+      components: { parentComponent }
+    }, result => {
+      expect(result).toContain('<div data-server-rendered="true"><div>some-val</div></div>')
+      done()
+    })
+  })
 })
 
 function renderVmWithOptions (options, cb) {