OnsenUI carousel component. Basic tests for OnsenUI module (#126)HEADmaster

11 files changed, 578 insertions, 0 deletions

diff --git a/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/OnsenUISpec.kt b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/OnsenUISpec.kt
new file mode 100644
index 00000000..8c97a29b
--- /dev/null
+++ b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/OnsenUISpec.kt
@@ -0,0 +1,40 @@
+/*
+ * Copyright (c) 2017-present Robert Jaros
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+package test.pl.treksoft.kvision.onsenui
+
+import pl.treksoft.kvision.onsenui.OnsenUi
+import pl.treksoft.kvision.onsenui.Platform
+import test.pl.treksoft.kvision.DomSpec
+import kotlin.test.Test
+import kotlin.test.assertEquals
+
+class OnsenUISpec : DomSpec {
+
+    @Test
+    fun isChrome() {
+        run {
+            OnsenUi.platformSelect(Platform.CHROME)
+            val isChrome = OnsenUi.isChrome()
+            assertEquals(true, isChrome, "Should detect the correct platform")
+        }
+    }
+}
diff --git a/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/carousel/CarouselItemSpec.kt b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/carousel/CarouselItemSpec.kt
new file mode 100644
index 00000000..da6caf11
--- /dev/null
+++ b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/carousel/CarouselItemSpec.kt
@@ -0,0 +1,54 @@
+/*
+ * Copyright (c) 2017-present Robert Jaros
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+package test.pl.treksoft.kvision.onsenui.carousel
+
+import pl.treksoft.kvision.onsenui.carousel.carousel
+import pl.treksoft.kvision.onsenui.carousel.carouselItem
+import pl.treksoft.kvision.onsenui.core.page
+import pl.treksoft.kvision.panel.ContainerType
+import pl.treksoft.kvision.panel.Root
+import test.pl.treksoft.kvision.DomSpec
+import kotlin.browser.document
+import kotlin.test.Test
+
+class CarouselItemSpec : DomSpec {
+
+    @Test
+    fun render() {
+        run {
+            val root = Root("test", containerType = ContainerType.FIXED)
+            root.page {
+                carousel {
+                    carouselItem("item 1")
+                    carouselItem("item 2")
+                }
+            }
+
+            val element = document.getElementById("test")
+            assertEqualsHtml(
+                "<ons-page class=\"page\"><div class=\"page__background\"></div><div class=\"page__content\"><ons-carousel class=\"ons-swiper\" style=\"touch-action: pan-y; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\"><div class=\"ons-swiper-target\" style=\"transform: translate3d(0px, 0px, 0px);\"><ons-carousel-item style=\"width: 100%;\">item 1</ons-carousel-item><ons-carousel-item style=\"width: 100%;\">item 2</ons-carousel-item></div><div class=\"ons-swiper-blocker\"></div></ons-carousel></div><span></span></ons-page>",
+                element?.innerHTML,
+                "Should render Onsen UI carousel component with items"
+            )
+        }
+    }
+}
diff --git a/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/carousel/CarouselSpec.kt b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/carousel/CarouselSpec.kt
new file mode 100644
index 00000000..dc2d21b6
--- /dev/null
+++ b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/carousel/CarouselSpec.kt
@@ -0,0 +1,51 @@
+/*
+ * Copyright (c) 2017-present Robert Jaros
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+package test.pl.treksoft.kvision.onsenui.carousel
+
+import pl.treksoft.kvision.onsenui.carousel.carousel
+import pl.treksoft.kvision.onsenui.core.page
+import pl.treksoft.kvision.panel.ContainerType
+import pl.treksoft.kvision.panel.Root
+import test.pl.treksoft.kvision.DomSpec
+import kotlin.browser.document
+import kotlin.test.Test
+
+class CarouselSpec : DomSpec {
+
+    @Test
+    fun render() {
+        run {
+            val root = Root("test", containerType = ContainerType.FIXED)
+            root.page {
+                carousel {
+                }
+            }
+
+            val element = document.getElementById("test")
+            assertEqualsHtml(
+                "<ons-page class=\"page\"><div class=\"page__background\"></div><div class=\"page__content\"><ons-carousel class=\"ons-swiper\" style=\"touch-action: pan-y; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\"><div class=\"ons-swiper-target\" style=\"transform: translate3d(0px, 0px, 0px);\"></div><div class=\"ons-swiper-blocker\"></div></ons-carousel></div><span></span></ons-page>",
+                element?.innerHTML,
+                "Should render Onsen UI carousel component"
+            )
+        }
+    }
+}
diff --git a/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/core/BackButtonSpec.kt b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/core/BackButtonSpec.kt
new file mode 100644
index 00000000..16b57da2
--- /dev/null
+++ b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/core/BackButtonSpec.kt
@@ -0,0 +1,55 @@
+/*
+ * Copyright (c) 2017-present Robert Jaros
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+package test.pl.treksoft.kvision.onsenui.core
+
+import pl.treksoft.kvision.onsenui.core.backButton
+import pl.treksoft.kvision.onsenui.core.page
+import pl.treksoft.kvision.onsenui.toolbar.toolbar
+import pl.treksoft.kvision.panel.ContainerType
+import pl.treksoft.kvision.panel.Root
+import test.pl.treksoft.kvision.DomSpec
+import kotlin.browser.document
+import kotlin.test.Test
+
+class BackButtonSpec : DomSpec {
+
+    @Test
+    fun render() {
+        run {
+            val root = Root("test", containerType = ContainerType.FIXED)
+            root.page {
+                toolbar {
+                    left {
+                        backButton()
+                    }
+                }
+            }
+
+            val element = document.getElementById("test")
+            assertEqualsHtml(
+                "<ons-page class=\"page\"><ons-toolbar><div class=\"left toolbar__left\"><ons-back-button></ons-back-button></div><div class=\"center toolbar__center\"></div><div class=\"right toolbar__right\"></div></ons-toolbar><div class=\"page__background\"></div><div class=\"page__content\"></div><span></span></ons-page>",
+                element?.innerHTML,
+                "Should render Onsen UI back button component"
+            )
+        }
+    }
+}
diff --git a/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/core/NavigatorSpec.kt b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/core/NavigatorSpec.kt
new file mode 100644
index 00000000..c95bf536
--- /dev/null
+++ b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/core/NavigatorSpec.kt
@@ -0,0 +1,51 @@
+/*
+ * Copyright (c) 2017-present Robert Jaros
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+package test.pl.treksoft.kvision.onsenui.core
+
+import pl.treksoft.kvision.onsenui.core.navigator
+import pl.treksoft.kvision.onsenui.core.page
+import pl.treksoft.kvision.panel.ContainerType
+import pl.treksoft.kvision.panel.Root
+import test.pl.treksoft.kvision.DomSpec
+import kotlin.browser.document
+import kotlin.test.Test
+import kotlin.test.assertTrue
+
+class NavigatorSpec : DomSpec {
+
+    @Test
+    fun render() {
+        run {
+            val root = Root("test", containerType = ContainerType.FIXED)
+            root.navigator {
+                page {
+                }
+            }
+
+            val element = document.getElementById("test")
+            assertTrue(
+                element?.innerHTML?.contains("<ons-navigator") == true,
+                "Should render Onsen UI navigator component"
+            )
+        }
+    }
+}
diff --git a/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/core/PageSpec.kt b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/core/PageSpec.kt
new file mode 100644
index 00000000..4846ddae
--- /dev/null
+++ b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/core/PageSpec.kt
@@ -0,0 +1,48 @@
+/*
+ * Copyright (c) 2017-present Robert Jaros
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+package test.pl.treksoft.kvision.onsenui.core
+
+import pl.treksoft.kvision.onsenui.core.page
+import pl.treksoft.kvision.panel.ContainerType
+import pl.treksoft.kvision.panel.Root
+import test.pl.treksoft.kvision.DomSpec
+import kotlin.browser.document
+import kotlin.test.Test
+
+class PageSpec : DomSpec {
+
+    @Test
+    fun render() {
+        run {
+            val root = Root("test", containerType = ContainerType.FIXED)
+            root.page {
+            }
+
+            val element = document.getElementById("test")
+            assertEqualsHtml(
+                "<ons-page class=\"page\"><div class=\"page__background\"></div><div class=\"page__content\"></div><span></span></ons-page>",
+                element?.innerHTML,
+                "Should render Onsen UI page component"
+            )
+        }
+    }
+}
diff --git a/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/splitter/SplitterSpec.kt b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/splitter/SplitterSpec.kt
new file mode 100644
index 00000000..92fe7ad9
--- /dev/null
+++ b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/splitter/SplitterSpec.kt
@@ -0,0 +1,62 @@
+/*
+ * Copyright (c) 2017-present Robert Jaros
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+package test.pl.treksoft.kvision.onsenui.splitter
+
+import pl.treksoft.kvision.html.div
+import pl.treksoft.kvision.onsenui.core.page
+import pl.treksoft.kvision.onsenui.splitter.splitter
+import pl.treksoft.kvision.onsenui.splitter.splitterContent
+import pl.treksoft.kvision.onsenui.splitter.splitterSide
+import pl.treksoft.kvision.panel.ContainerType
+import pl.treksoft.kvision.panel.Root
+import test.pl.treksoft.kvision.DomSpec
+import kotlin.browser.document
+import kotlin.test.Test
+
+class SplitterSpec : DomSpec {
+
+    @Test
+    fun render() {
+        run {
+            val root = Root("test", containerType = ContainerType.FIXED)
+            root.splitter {
+                splitterSide {
+                    page {
+                        div("menu")
+                    }
+                }
+                splitterContent {
+                    page {
+                        div("content")
+                    }
+                }
+            }
+
+            val element = document.getElementById("test")
+            assertEqualsHtml(
+                "<ons-splitter data-device-back-button-handler-id=\"2\" style=\"touch-action: pan-y; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\"><ons-splitter-side side=\"left\" mode=\"split\" style=\"width: 80%;\"><ons-page class=\"page\"><div class=\"page__background\"></div><div class=\"page__content\"><div>menu</div></div><span></span></ons-page></ons-splitter-side><ons-splitter-content style=\"left: 80%;\"><ons-page class=\"page\"><div class=\"page__background\"></div><div class=\"page__content\"><div>content</div></div><span></span></ons-page></ons-splitter-content><ons-splitter-mask style=\"display: none;\"></ons-splitter-mask></ons-splitter>",
+                element?.innerHTML,
+                "Should render Onsen UI splitter component"
+            )
+        }
+    }
+}
diff --git a/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/tabbar/TabbarSpec.kt b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/tabbar/TabbarSpec.kt
new file mode 100644
index 00000000..80c55be2
--- /dev/null
+++ b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/tabbar/TabbarSpec.kt
@@ -0,0 +1,59 @@
+/*
+ * Copyright (c) 2017-present Robert Jaros
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+package test.pl.treksoft.kvision.onsenui.tabbar
+
+import pl.treksoft.kvision.onsenui.core.page
+import pl.treksoft.kvision.onsenui.tabbar.tab
+import pl.treksoft.kvision.onsenui.tabbar.tabbar
+import pl.treksoft.kvision.panel.ContainerType
+import pl.treksoft.kvision.panel.Root
+import test.pl.treksoft.kvision.DomSpec
+import kotlin.browser.document
+import kotlin.test.Test
+
+class TabbarSpec : DomSpec {
+
+    @Test
+    fun render() {
+        run {
+            val root = Root("test", containerType = ContainerType.FIXED)
+            root.page {
+                tabbar {
+                    tab("tab 1") {
+                        page {
+                        }
+                    }
+                    tab("tab 2") {
+                        page {
+                        }
+                    }
+                }
+            }
+            val element = document.getElementById("test")
+            assertEqualsHtml(
+                "<ons-page class=\"page page--wrapper\"><div class=\"page__background\"></div><div class=\"page__content\" style=\"\"><ons-tabbar><div class=\"tabbar__content ons-tabbar__content ons-swiper\" style=\"touch-action: pan-y; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\"><div class=\"ons-swiper-target\" style=\"transform: translate3d(0px, 0px, 0px);\"></div><div class=\"ons-swiper-blocker\"></div></div><div class=\"tabbar ons-tabbar__footer ons-swiper-tabbar\"><ons-tab page=\"kv_ons_tab_0\" label=\"tab 1\" active=\"\"></ons-tab><ons-tab page=\"kv_ons_tab_1\" label=\"tab 2\"></ons-tab><div class=\"tabbar__border\"></div></div></ons-tabbar></div><span></span></ons-page>",
+                element?.innerHTML,
+                "Should render Onsen UI tab bar component"
+            )
+        }
+    }
+}
\ No newline at end of file
diff --git a/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/toolbar/BottomToolbarSpec.kt b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/toolbar/BottomToolbarSpec.kt
new file mode 100644
index 00000000..05f7ac0e
--- /dev/null
+++ b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/toolbar/BottomToolbarSpec.kt
@@ -0,0 +1,52 @@
+/*
+ * Copyright (c) 2017-present Robert Jaros
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+package test.pl.treksoft.kvision.onsenui.toolbar
+
+import pl.treksoft.kvision.html.div
+import pl.treksoft.kvision.onsenui.core.page
+import pl.treksoft.kvision.onsenui.toolbar.bottomToolbar
+import pl.treksoft.kvision.panel.ContainerType
+import pl.treksoft.kvision.panel.Root
+import test.pl.treksoft.kvision.DomSpec
+import kotlin.browser.document
+import kotlin.test.Test
+
+class BottomToolbarSpec : DomSpec {
+
+    @Test
+    fun render() {
+        run {
+            val root = Root("test", containerType = ContainerType.FIXED)
+            root.page {
+                bottomToolbar {
+                    div("toolbar")
+                }
+            }
+            val element = document.getElementById("test")
+            assertEqualsHtml(
+                "<ons-page class=\"page\"><div class=\"page__background\"></div><div class=\"page__content\"><ons-bottom-toolbar class=\"bottom-bar\"><div>toolbar</div></ons-bottom-toolbar></div><span></span></ons-page>",
+                element?.innerHTML,
+                "Should render Onsen UI bottom toolbar component"
+            )
+        }
+    }
+}
\ No newline at end of file
diff --git a/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/toolbar/ToolbarButtonSpec.kt b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/toolbar/ToolbarButtonSpec.kt
new file mode 100644
index 00000000..7c0fd448
--- /dev/null
+++ b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/toolbar/ToolbarButtonSpec.kt
@@ -0,0 +1,54 @@
+/*
+ * Copyright (c) 2017-present Robert Jaros
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+package test.pl.treksoft.kvision.onsenui.toolbar
+
+import pl.treksoft.kvision.onsenui.core.page
+import pl.treksoft.kvision.onsenui.toolbar.toolbar
+import pl.treksoft.kvision.onsenui.toolbar.toolbarButton
+import pl.treksoft.kvision.panel.ContainerType
+import pl.treksoft.kvision.panel.Root
+import test.pl.treksoft.kvision.DomSpec
+import kotlin.browser.document
+import kotlin.test.Test
+
+class ToolbarButtonSpec : DomSpec {
+
+    @Test
+    fun render() {
+        run {
+            val root = Root("test", containerType = ContainerType.FIXED)
+            root.page {
+                toolbar("center") {
+                    right {
+                        toolbarButton("test")
+                    }
+                }
+            }
+            val element = document.getElementById("test")
+            assertEqualsHtml(
+                "<ons-page class=\"page\"><ons-toolbar><div class=\"left toolbar__left\"></div><div class=\"center toolbar__center\">center</div><div class=\"right toolbar__right\"><ons-toolbar-button>test</ons-toolbar-button></div></ons-toolbar><div class=\"page__background\"></div><div class=\"page__content\"></div><span></span></ons-page>",
+                element?.innerHTML,
+                "Should render Onsen UI toolbar button component"
+            )
+        }
+    }
+}
diff --git a/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/toolbar/ToolbarSpec.kt b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/toolbar/ToolbarSpec.kt
new file mode 100644
index 00000000..f9a3eac3
--- /dev/null
+++ b/kvision-modules/kvision-onsenui/src/test/kotlin/test/pl/treksoft/kvision/onsenui/toolbar/ToolbarSpec.kt
@@ -0,0 +1,52 @@
+/*
+ * Copyright (c) 2017-present Robert Jaros
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+package test.pl.treksoft.kvision.onsenui.toolbar
+
+import pl.treksoft.kvision.onsenui.core.page
+import pl.treksoft.kvision.onsenui.toolbar.toolbar
+import pl.treksoft.kvision.panel.ContainerType
+import pl.treksoft.kvision.panel.Root
+import test.pl.treksoft.kvision.DomSpec
+import kotlin.browser.document
+import kotlin.test.Test
+
+class ToolbarSpec : DomSpec {
+
+    @Test
+    fun render() {
+        run {
+            val root = Root("test", containerType = ContainerType.FIXED)
+            root.page {
+                toolbar("center") {
+                    left { +"left" }
+                    right { +"right" }
+                }
+            }
+            val element = document.getElementById("test")
+            assertEqualsHtml(
+                "<ons-page class=\"page\"><ons-toolbar><div class=\"left toolbar__left\">left</div><div class=\"center toolbar__center\">center</div><div class=\"right toolbar__right\">right</div></ons-toolbar><div class=\"page__background\"></div><div class=\"page__content\"></div><span></span></ons-page>",
+                element?.innerHTML,
+                "Should render Onsen UI toolbar component"
+            )
+        }
+    }
+}
\ No newline at end of file