Skip to content

getSSRProps return value does not pass down innerHTML as dom props #8112

@henkvhest

Description

@henkvhest

Vue version

3.2.47

Link to minimal reproduction

https://stackblitz.com/edit/github-c1z4a8-we3axz?file=src/main.ts

Steps to reproduce

return { innerHTML: 'some value' } from a Vue directive via getSSRProps. innerHTML is then not propagated. (see also stackblitz example)

What is expected?

I expect innerHTML to be defined serverside so that my component is prefilled with content before rendering.

What is actually happening?

The innerHTML is not filled, which means the content stays blank (see stackblitz example)

System Info

System:
    OS: macOS 12.6
    CPU: (10) arm64 Apple M1 Pro
    Memory: 96.88 MB / 32.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 16.14.2 - ~/.nvm/versions/node/v16.14.2/bin/node
    Yarn: 1.22.19 - ~/.nvm/versions/node/v16.14.2/bin/yarn
    npm: 8.5.0 - ~/.nvm/versions/node/v16.14.2/bin/npm
  Browsers:
    Chrome: 112.0.5615.121
    Firefox: 112.0.1
    Safari: 16.0

Any additional comments?

I'm currently working rewriting some parts of our codebase from Nuxt 2 to Nuxt 3. I initially thought this was related to Nuxt but the same issue is happening in Vue 3 with SSR rendering too. I try to modify the innerHTML serverside but it seems that innerHTML is not propagated. I tried in the stackblitz example to write some content to innerHTML via getSSRProps. I'm not sure if this is a bug or intended behaviour, or perhaps there is a different way to modify innerHTML in getSSRProps?

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions

      pFad - Phonifier reborn

      Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

      Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


      Alternative Proxies:

      Alternative Proxy

      pFad Proxy

      pFad v3 Proxy

      pFad v4 Proxy