Skip to content

Components slots are not rendered inside svg foreignObject #11315

Open
@Aleksandras-Novikovas

Description

@Aleksandras-Novikovas

Version

2.6.11

Reproduction link

https://jsfiddle.net/AleksandrasNovikovas/w042x1c8/

Steps to reproduce

Run provided fiddle. There are three svg boxes with foreignObject:

  1. contains simple html tags
  2. contains simple vue component
  3. contains complex (with slot) vue component

What is expected?

All three boxes should show link and input elements

What is actually happening?

Third box does not show link and input elements.


While inspecting DOM (in chrome or in firefox) you will find that elements of second box and third box are identical.
Problem is their types: (in chome dev console select element and tab properties)
select input element from second box and you will find following list: Object->EventTarget->Node->Element->HTMLElement->HTMLInputElement->input;
select input element from third box and you will find following list: Object->EventTarget->Node->Element->SVGElement->input;

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions