How to use the awe.CustomElement function in awe

def test_custom_element_custom_update_element_action(element_tester):
    custom_class = 'custom1'

    class TestElement(CustomElement):

        def _init(self, data):
            self.update_data(data)

        @classmethod
        def _js(cls):
            return '''
                Awe.registerUpdateElementAction('removeKeys', data => map => map.deleteAll(data));
                register((e) => (
                    <div>
                        {Object.values(e.data.map).map((v, i) =&gt; <div>{v}</div>)}
                    </div>
                ));
            '''

    element_data = {

def test_custom_element_globals(element_tester):
    custom1_class = 'custom1'
    custom2_class = 'custom2'
    custom3_class = 'custom3'
    custom1_text = 'custom1 text'
    custom2_text = 'custom2 text'
    custom3_text = 'custom3 text'

    class TestElement1(CustomElement):
        @classmethod
        def _js(cls):
            return 'register((e) => {})'.format(custom1_text)

    class TestElement2(CustomElement):
        @classmethod
        def _js(cls):
            return '''
            class TestElement2 extends React.Component {
                render() {
                    return <div>custom2 text</div>
                }
            }
            register((e) =&gt; )
            '''

    class TestElement3(CustomElement):
        @classmethod
        def _js(cls):
            return '''
            class TestElement2 extends Component {

def test_custom_element_globals(element_tester):
    custom1_class = 'custom1'
    custom2_class = 'custom2'
    custom3_class = 'custom3'
    custom1_text = 'custom1 text'
    custom2_text = 'custom2 text'
    custom3_text = 'custom3 text'

    class TestElement1(CustomElement):
        @classmethod
        def _js(cls):
            return 'register((e) => {})'.format(custom1_text)

    class TestElement2(CustomElement):
        @classmethod
        def _js(cls):
            return '''
            class TestElement2 extends React.Component {
                render() {
                    return <div>custom2 text</div>
                }
            }
            register((e) =&gt; )
            '''

def test_export_with_custom_element():
    js_code = 'register((e) =&gt; <div>text</div>)'

    class TestElement(CustomElement):
        @classmethod
        def _js(cls):
            return js_code

    page = Page()
    page.new(TestElement)
    assert js_code in page.export()

def _js(cls):
            return 'register((e) => {})'.format(custom1_text)

    class TestElement2(CustomElement):
        @classmethod
        def _js(cls):
            return '''
            class TestElement2 extends React.Component {
                render() {
                    return <div>custom2 text</div>
                }
            }
            register((e) =&gt; )
            '''

    class TestElement3(CustomElement):
        @classmethod
        def _js(cls):
            return '''
            class TestElement2 extends Component {
                render() {
                    return <div>custom3 text</div>
                }
            }
            register((e) =&gt; )
            '''

    def builder(page):
        page.new(TestElement1, props={'className': custom1_class})
        page.new(TestElement2, props={'className': custom2_class})
        page.new(TestElement3, props={'className': custom3_class})

from awe import Page, CustomElement


class Moment(CustomElement):
    _scripts = ['https://unpkg.com/moment@2.23.0/min/moment.min.js']

    @classmethod
    def _js(cls):
        return 'register((e) =&gt; <div>{moment().format()}</div>);'


class Popover(CustomElement):

    def _init(self, title):
        self.update_props({'title': title})

    @classmethod
    def _js(cls):
        return '''
            register((popover) =&gt; (
                
                    {popover.children}
                
            ));
        '''


def main():

from awe import Page, CustomElement


class Moment(CustomElement):
    _scripts = ['https://unpkg.com/moment@2.23.0/min/moment.min.js']

    @classmethod
    def _js(cls):
        return 'register((e) =&gt; <div>{moment().format()}</div>);'


class Popover(CustomElement):

    def _init(self, title):
        self.update_props({'title': title})

    @classmethod
    def _js(cls):
        return '''
            register((popover) =&gt; (

import os

from awe import Page, CustomElement
import examples


class HighlightJS(CustomElement):

    _scripts = ['https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.14.1/highlight.min.js']
    _styles = ['https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.14.1/styles/tomorrow-night-bright.min.css']

    @classmethod
    def _js(cls):
        return '''
            setTimeout(() => {
                document.querySelectorAll('.python').forEach((block) => {
                    hljs.highlightBlock(block);
                });
            }, 500);
        '''


def main():