Skip to content

SSR: missing class and style attributes with async components #11837

@realityfilter

Description

@realityfilter

Version

2.6.11

Reproduction link

https://github.com/realityfilter/bugreport-dynamic-components-ssr

https://replit.com/@posva/vuejsvue11837

Steps to reproduce

  • run

What is expected?

<app data-server-rendered="true"><div class="child parent app"></div> <div class="child async parent app"></div></app>

What is actually happening?

<app data-server-rendered="true"><div class="child parent app"></div> <div class="child async parent"></div></app>

There are some workarounds for this issue:

  • avoiding async components via manual registering the components in a plugin
  • wrapping the DynamicComponent with a div

Activity

realityfilter

realityfilter commented on Dec 21, 2020

@realityfilter
Author

The incorrect DOM looks like:

ssr-dom

yshrsmz

yshrsmz commented on Mar 5, 2021

@yshrsmz

I'm having the same issue.

when manually bind $attrs like below, it seems to render attributes while SSR.
but I can't render class and style for some reason

<component is="SomeComponent v-bind="$attrs" />
pi0

pi0 commented on Mar 31, 2021

@pi0
Contributor

I've managed to create bare minimum reproduction: https://replit.com/@pi0/vuejsvue11837#index.js

Even without dynamic components, an async component fails to inherit a class from the two-level upper parent (check the difference between <child> and <async-child> classes).

Once made a fix PR can ensure these two issues are the same (root cause) but my guess is they are.

changed the title [-]SSR: missing class and style attributes with dynamic async components[/-] [+]SSR: missing class and style attributes with async components[/+] on Jun 2, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @realityfilter@yshrsmz@posva@pi0

        Issue actions

          SSR: missing class and style attributes with async components · Issue #11837 · vuejs/vue