[Plugin API] UI Components constucted outside passed containerEl

Steps to reproduce

  1. Open the Obsidian sample plugin.
  2. Modify it to include a custom view. Also add some way to open said custom view.
  3. Inside the onOpen() function of your custom view, add the following code (example is in javascript):
onOpen() {
  new DropdownComponent(this.containerEl);
  new SliderComponent(this.containerEl);
  new ToggleComponent(this.containerEl);
}
  1. npm run build
  2. Add your custom plugin to your .obsidian/plugins folder.
  3. Run obsidian, enable your custom plugin, and open your custom view.
  4. Observe how the created components are siblings of the this.containerEl, rather than children.

Expected result

The components should be children of the passed containerEl.

Actual result

The elements were siblings. Here is some example html, only including a dropdown:
Log.zip (1.6 KB)

Environment

  • Operating system: Ubuntu 18.04
  • Obsidian version: 0.9.15

Additional information

BadComponents

For this, open an issue in the api repo.

1 Like