add basic test of IDOM

Author: rmorshea

noxfile.py

@@ -46,11 +46,13 @@ def test(session: Session) -> None:
 @nox.session
 def test_suite(session: Session) -> None:
     """Run the Python-based test suite"""
-    session.env["IDOM_DEBUG_MODE"] = "1"
     install_requirements_file(session, "test-env")
     session.install(".[all]")
-    session.chdir("tests")
-    session.run("figure-it-out")
+
+    session.chdir(HERE / "tests")
+    session.env["IDOM_DEBUG_MODE"] = "1"
+    session.run("python", "manage.py", "build_js")
+    session.run("python", "manage.py", "test")
 
 
 @nox.session

requirements/test-env.txt

@@ -1 +1,6 @@
 django
+selenium
+
+# required due issue with channels:
+# https://github.com/django/channels/issues/1639#issuecomment-817994671
+twisted<21

src/django_idom/__init__.py

@@ -2,4 +2,5 @@
 
 from .websocket_consumer import IdomAsyncWebSocketConsumer
 
+
 __all__ = ["IdomAsyncWebSocketConsumer"]

src/django_idom/websocket_consumer.py

@@ -3,10 +3,9 @@
 from typing import Any
 
 from channels.generic.websocket import AsyncJsonWebsocketConsumer
-
-from idom.core.layout import Layout
 from idom.core.dispatcher import dispatch_single_view
-from idom.core.component import ComponentConstructor
+from idom.core.layout import Layout, LayoutEvent
+from idom.core.proto import ComponentConstructor
 
 
 class IdomAsyncWebSocketConsumer(AsyncJsonWebsocketConsumer):
@@ -20,22 +19,26 @@ def __init__(
 
     async def connect(self) -> None:
         await super().connect()
-        self._idom_recv_queue = recv_queue = asyncio.Queue()
-        self._idom_dispatcher_future = asyncio.ensure_future(
-            dispatch_single_view(
-                Layout(self._idom_component_constructor()),
-                self.send_json,
-                recv_queue.get,
-            )
-        )
+        self._idom_dispatcher_future = asyncio.ensure_future(self._run_dispatch_loop())
 
-    async def close(self, *args: Any, **kwargs: Any) -> None:
+    async def disconnect(self, code: int) -> None:
         if self._idom_dispatcher_future.done():
             await self._idom_dispatcher_future
         else:
             self._idom_dispatcher_future.cancel()
-        await asyncio.wait([self._idom_dispatcher_future])
-        await super().close(*args, **kwargs)
+        await super().disconnect(code)
 
     async def receive_json(self, content: Any, **kwargs: Any) -> None:
-        await self._idom_recv_queue.put(content)
+        await self._idom_recv_queue.put(LayoutEvent(**content))
+
+    async def _run_dispatch_loop(self):
+        self._idom_recv_queue = recv_queue = asyncio.Queue()
+        try:
+            await dispatch_single_view(
+                Layout(self._idom_component_constructor()),
+                self.send_json,
+                recv_queue.get,
+            )
+        except Exception:
+            await self.close()
+            raise

tests/test_app/asgi.py

@@ -12,7 +12,8 @@
 from django.conf.urls import url
 from django.core.asgi import get_asgi_application
 
-from .views import HelloWorld
+from .views import Root
+
 
 os.environ.setdefault("DJANGO_SETTINGS_MODULE", "test_app.settings")
 
@@ -23,11 +24,12 @@
 
 from django_idom import IdomAsyncWebSocketConsumer
 
+
 application = ProtocolTypeRouter(
     {
         "http": http_asgi_app,
         "websocket": URLRouter(
-            [url("", IdomAsyncWebSocketConsumer.as_asgi(component=HelloWorld))]
+            [url("", IdomAsyncWebSocketConsumer.as_asgi(component=Root))]
         ),
     }
 )

tests/test_app/management/commands/build_js.py

@@ -1,7 +1,9 @@
 import subprocess
 from pathlib import Path
+
 from django.core.management.base import BaseCommand
 
+
 HERE = Path(__file__).parent
 JS_DIR = HERE.parent.parent.parent / "js"
 

tests/test_app/settings.py

@@ -12,6 +12,7 @@
 import os
 from pathlib import Path
 
+
 # Build paths inside the project like this: BASE_DIR / 'subdir'.
 BASE_DIR = Path(__file__).resolve().parent.parent
 
@@ -78,8 +79,11 @@
 DATABASES = {
     "default": {
         "ENGINE": "django.db.backends.sqlite3",
-        "NAME": BASE_DIR / "db.sqlite3",
-    }
+        "NAME": os.path.join(BASE_DIR, "db.sqlite3"),
+        "TEST": {
+            "NAME": os.path.join(BASE_DIR, "db_test.sqlite3"),
+        },
+    },
 }
 
 

tests/test_app/tests.py

@@ -1,3 +1,33 @@
-from django.test import TestCase
+from channels.testing import ChannelsLiveServerTestCase
+from selenium import webdriver
+from selenium.webdriver.support.ui import WebDriverWait
 
-# Create your tests here.
+
+class TestIdomCapabilities(ChannelsLiveServerTestCase):
+    def setUp(self):
+        self.driver = make_driver(5, 5)
+        self.driver.get(self.live_server_url)
+
+    def tearDown(self) -> None:
+        self.driver.quit()
+
+    def wait_until(self, condition, timeout=5):
+        WebDriverWait(self.driver, timeout).until(lambda driver: condition())
+
+    def test_hello_world(self):
+        self.driver.find_element_by_id("hello-world")
+
+    def test_counter(self):
+        button = self.driver.find_element_by_id("counter-inc")
+        count = self.driver.find_element_by_id("counter-num")
+
+        for i in range(5):
+            self.wait_until(lambda: count.get_attribute("data-count") == str(i))
+            button.click()
+
+
+def make_driver(page_load_timeout, implicit_wait_timeout):
+    driver = webdriver.Chrome()
+    driver.set_page_load_timeout(page_load_timeout)
+    driver.implicitly_wait(implicit_wait_timeout)
+    return driver

tests/test_app/urls.py

@@ -18,6 +18,8 @@
     2. Add a URL to urlpatterns:  path('blog/', include('blog.urls'))
 """
 from django.urls import path
+
 from .views import base_template
 
+
 urlpatterns = [path("", base_template)]

tests/test_app/views.py

@@ -1,6 +1,6 @@
 import idom
-from django.template import loader
 from django.http import HttpResponse
+from django.template import loader
 
 
 def base_template(request):
@@ -9,6 +9,26 @@ def base_template(request):
     return HttpResponse(template.render(context, request))
 
 
+@idom.component
+def Root():
+    return idom.html.div(HelloWorld(), Counter())
+
+
 @idom.component
 def HelloWorld():
     return idom.html.h1({"id": "hello-world"}, "Hello World!")
+
+
+@idom.component
+def Counter():
+    count, set_count = idom.hooks.use_state(0)
+    return idom.html.div(
+        idom.html.button(
+            {"id": "counter-inc", "onClick": lambda event: set_count(count + 1)},
+            "Click me!",
+        ),
+        idom.html.p(
+            {"id": "counter-num", "data-count": count},
+            f"Current count is: {count}",
+        ),
+    )