mol_jsx_lib 0.0.58 → 0.0.61

package/web.test.js

@@ -326,7 +326,7 @@ var $;
                 return $mol_jsx("button", { title: props.hint }, target());
             };
             const dom = $mol_jsx(Button, { id: "foo", hint: "click me" }, () => 'hey!');
-            $mol_assert_equal(dom.outerHTML, '<button title="click me" id="foo">hey!</button>');
+            $mol_assert_equal(dom.outerHTML, '<button title="click me" id="foo" class="Button">hey!</button>');
         },
         'Nested guid generation'() {
             const Foo = () => {
@@ -335,10 +335,12 @@ var $;
                         $mol_jsx("img", { id: "icon" })));
             };
             const Bar = (props, icon) => {
-                return $mol_jsx("span", null, icon);
+                return $mol_jsx("span", null,
+                    icon,
+                    $mol_jsx("i", { id: "label" }));
             };
             const dom = $mol_jsx(Foo, { id: "foo" });
-            $mol_assert_equal(dom.outerHTML, '<div id="foo"><span id="foo/bar"><img id="foo/icon"></span></div>');
+            $mol_assert_equal(dom.outerHTML, '<div id="foo" class="Foo"><span id="foo/bar" class="Foo_bar Bar"><img id="foo/icon" class="Foo_icon"><i id="foo/bar/label" class="Foo_bar_label Bar_label"></i></span></div>');
         },
         'Fail on non unique ids'() {
             const App = () => {
@@ -351,13 +353,13 @@ var $;
         'Owner based guid generationn'() {
             const Foo = () => {
                 return $mol_jsx("div", null,
-                    $mol_jsx(Bar, { id: "bar", icon: () => $mol_jsx("img", { id: "icon" }) }));
+                    $mol_jsx(Bar, { id: "middle", icon: () => $mol_jsx("img", { id: "icon" }) }));
             };
             const Bar = (props) => {
                 return $mol_jsx("span", null, props.icon());
             };
-            const dom = $mol_jsx(Foo, { id: "foo" });
-            $mol_assert_equal(dom.outerHTML, '<div id="foo"><span id="foo/bar"><img id="foo/icon"></span></div>');
+            const dom = $mol_jsx(Foo, { id: "app" });
+            $mol_assert_equal(dom.outerHTML, '<div id="app" class="Foo"><span id="app/middle" class="Foo_middle Bar"><img id="app/icon" class="Foo_icon"></span></div>');
         },
         'Fail on same ids from different caller'() {
             const Foo = () => {
@@ -1451,7 +1453,7 @@ var $;
             const dom = $mol_jsx(Foo, { id: "foo", title: "bar" },
                 "xxx",
                 123);
-            $mol_assert_equal(dom.outerHTML, '<div id="foo">bar xxx-123</div>');
+            $mol_assert_equal(dom.outerHTML, '<div id="foo" class="Foo">bar xxx-123</div>');
         },
         'View by element'() {
             let br;
@@ -1485,10 +1487,10 @@ var $;
             const dom = $mol_jsx_attach(doc, () => $mol_jsx(Title, { id: "foo" }));
             const title = Title.of(dom);
             $mol_assert_equal(title.ownerDocument, doc);
-            $mol_assert_equal(doc.documentElement.outerHTML, '<html><body id="foo">foo</body></html>');
+            $mol_assert_equal(doc.documentElement.outerHTML, '<html><body id="foo" class="Title">foo</body></html>');
             title.value('bar');
             await $mol_wire_fiber.sync();
-            $mol_assert_equal(doc.documentElement.outerHTML, '<html><body id="foo">bar</body></html>');
+            $mol_assert_equal(doc.documentElement.outerHTML, '<html><body id="foo" class="Title">bar</body></html>');
         },
         async 'Nested bound views'($) {
             class Task extends $mol_jsx_view {
@@ -1516,15 +1518,15 @@ var $;
             ], App.prototype, "title", null);
             const doc = $mol_dom_parse('<html xmlns="http://www.w3.org/1999/xhtml"><body id="root"></body></html>');
             const root = $.$mol_jsx_attach(doc, () => $mol_jsx(App, { "$": $, id: "root" }));
-            $mol_assert_equal($mol_dom_serialize(doc.documentElement), '<html xmlns="http://www.w3.org/1999/xhtml"><body id="root" class="list"></body></html>');
+            $mol_assert_equal($mol_dom_serialize(doc.documentElement), '<html xmlns="http://www.w3.org/1999/xhtml"><body id="root" class="list App List"></body></html>');
             App.of(root).title('barbar');
             await $mol_wire_fiber.sync();
             $mol_assert_equal(Task.of(root.firstElementChild).title(), 'barbar');
-            $mol_assert_equal(doc.documentElement.outerHTML, '<html xmlns="http://www.w3.org/1999/xhtml"><body id="root" class="list"><h1 id="root/task">barbar</h1></body></html>');
+            $mol_assert_equal(doc.documentElement.outerHTML, '<html xmlns="http://www.w3.org/1999/xhtml"><body id="root" class="list App List"><h1 id="root/task" class="App_task Task">barbar</h1></body></html>');
             Task.of(root.firstElementChild).title('foofoo');
             await $mol_wire_fiber.sync();
             $mol_assert_equal(App.of(root).title(), 'foofoo');
-            $mol_assert_equal(doc.documentElement.outerHTML, '<html xmlns="http://www.w3.org/1999/xhtml"><body id="root" class="list"><h1 id="root/task">foofoo</h1></body></html>');
+            $mol_assert_equal(doc.documentElement.outerHTML, '<html xmlns="http://www.w3.org/1999/xhtml"><body id="root" class="list App List"><h1 id="root/task" class="App_task Task">foofoo</h1></body></html>');
         },
     });
 })($ || ($ = {}));