WebComponents / Dropdown menu issue

[lukaszkaleta]

Version

latest @toast-ui/editor

Test Environment

ANY browser, Linux

Current Behavior

When trying tui.editor inside WebComponent (Lit) I have issue with all dropdowns like Heading, Table.
When clicking on dorpdawn nothing happens and it is not possible to add heading.

import {css, html, LitElement} from 'lit'

import Editor from '@toast-ui/editor';
import {iMarkdownEditorStyles} from 'shared/component/markdown/i-markdown-editor-styles.js'

export class IMarkdownEditor extends LitElement {

    constructor() {
        super()
    }

    static properties = {
        value: {type: String}
    }

    static styles = [
        iMarkdownEditorStyles
    ]

    firstUpdated(_changedProperties) {
        const editor = new Editor({
            el: this.renderRoot.querySelector('#editor'),
            previewStyle: 'vertical',
            height: '500px',
            initialValue: 'Test',
            initialEditType: 'wysiwyg',
            language: 'nb',
            toolbarItems: [
                ['heading', 'bold', 'italic', 'strike'],
                ['hr', 'quote'],
                ['ul', 'ol', 'task', 'indent', 'outdent']
            ],
            frontMatter: true,
        });
    }

    render() {
        return html`<div id="editor"></div>`
    }
}

customElements.define('i-markdown-editor', IMarkdownEditor)

[jwlee1108]

@lukaszkaleta
Sorry for the late reply. I don't have experience with WebComponent (LitElement). First of all, I'll figure out the issue. sorry.

[stale]

This issue has been automatically marked as inactive because there hasn’t been much going on it lately. It is going to be closed after 7 days. Thanks!

[stale]

This issue will be closed due to inactivity. Thanks for your contribution!

[thomas-darling]

This is still broken - please reopen