Merge pull request #26 from jokiefer/4_implement_tests_for_javascript

4 implement tests for javascript
jokiefer · Jan 4, 2021 · e1735d0 · e1735d0
2 parents 7147cf8 + be342b0
commit e1735d0
Show file tree

Hide file tree

Showing 8 changed files with 121 additions and 5 deletions.
diff --git a/.gitignore b/.gitignore
@@ -130,3 +130,7 @@ dmypy.json
 .scannerwork/
 coverage-report.xml
 xunit-result.xml
+
+# npm
+node_modules/
+package-lock.json
diff --git a/django_bootstrap_swt/static/django_bootstrap_swt/js/django_bootstrap_swt.js b/django_bootstrap_swt/static/django_bootstrap_swt/js/django_bootstrap_swt.js
@@ -25,19 +25,19 @@ function bootstrapComponentAjaxCall( target, target_body ) {
 
 function modalAjaxInit( parent ) {
     $(".modal[data-url]", parent).on('shown.bs.modal', function( event ) {
-        bootstrapComponentAjaxCall(event.currentTarget, $('.modal-body', event.currentTarget));
+        bootstrapComponentAjaxCall( event.currentTarget, $( '.modal-body', event.currentTarget ) );
     });
 }
 
 function collapseAjaxInit( parent ) {
     $(".collapse[data-url]", parent).on('shown.bs.collapse', function( event ) {
-        bootstrapComponentAjaxCall(event.target, $(event.target));
+        bootstrapComponentAjaxCall( event.target, $( event.target ) );
     });
 }
 
 function initAjaxComponents( parent ) {
-    modalAjaxInit(parent);
-    collapseAjaxInit(parent);
+    modalAjaxInit( parent );
+    collapseAjaxInit( parent );
 }
 
 $( document ).ready( function(){

diff --git a/django_bootstrap_swt/templates/django_bootstrap_swt/includes/ajax_loading_spinner.html b/django_bootstrap_swt/templates/django_bootstrap_swt/includes/ajax_loading_spinner.html
@@ -1,2 +1,2 @@
 {% load static i18n %}
-<div class="django-bootstrap-swt-spinner d-none"><div class="spinner-border spinner-border-sm" role="status"><span class="sr-only">{% trans 'Loading...' %}</span></div><span class="d-sm">{% trans 'Loading...' %}</span><div class="text-danger django-bootstrap-swt-error d-none"><i class="fas fa-bolt"></i><span>{% trans ' Can\'t fetch content' %}</span></div></div>
+<div class="django-bootstrap-swt-spinner d-none"><div class="spinner-border spinner-border-sm" role="status"><span class="sr-only">{% trans 'Loading...' %}</span></div><span class="d-sm">{% trans 'Loading...' %}</span></div>
diff --git a/js_tests/index.html b/js_tests/index.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width">
+    <title>Test Suite</title>
+    <link rel="stylesheet" href="../node_modules/qunit/qunit/qunit.css">
+  </head>
+  <body>
+    <div id="qunit"></div>
+    <div id="qunit-fixture"></div>
+    <script src="../node_modules/qunit/qunit/qunit.js"></script>
+    <script src="../node_modules/jquery/dist/jquery.js"></script>
+    <script src="../node_modules/bootstrap/dist/js/bootstrap.js"></script>
+    <script src="../django_bootstrap_swt/static/django_bootstrap_swt/js/django_bootstrap_swt.js"></script>
+    <script src="test_django_bootstrap_swt.js"></script>
+</body>
+</html>
diff --git a/js_tests/modal-content.html b/js_tests/modal-content.html
@@ -0,0 +1 @@
+Hello
diff --git a/js_tests/modal.html b/js_tests/modal.html
@@ -0,0 +1,15 @@
+<div id="id_modal" class="modal" tabindex="-1" role="document" data-url="">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h5 class="modal-title">nice modal</h5>
+        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+          <span aria-hidden="true">&times;</span>
+        </button>
+      </div>
+      <div id="id_modal_body" class="modal-body">
+        <div class="django-bootstrap-swt-spinner d-none"><div class="spinner-border spinner-border-sm" role="status"><span class="sr-only">{% trans 'Loading...' %}</span></div><span class="d-sm">{% trans 'Loading...' %}</span><div class="text-danger django-bootstrap-swt-error d-none"><i class="fas fa-bolt"></i><span>{% trans ' Can\'t fetch content' %}</span></div></div>
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/js_tests/test_django_bootstrap_swt.js b/js_tests/test_django_bootstrap_swt.js
@@ -0,0 +1,47 @@
+var data_url;
+
+QUnit.module('django-bootstrap-swt', {
+    beforeEach: function() {
+        $.ajax({
+            type: "GET",
+            url : "modal.html",
+            dataType: "html",
+            async: false,
+            success : function (data) {
+                $("#qunit-fixture").html(data);
+            }
+        });
+        data_url = $( "#id_modal" )[0].attributes.getNamedItem('data-url');
+    }
+});
+
+QUnit.test("bootstrapComponentAjaxCall adds response content to target_body", function(assert) {
+    data_url.value = "modal-content.html"
+    var modal = $( "#id_modal" );
+    var body = $('#id_modal_body');
+
+    bootstrapComponentAjaxCall( modal[0], body )
+
+    var done = assert.async();
+    setTimeout(function() {
+       assert.equal(body.text(), 'Hello');
+       // Tell QUnit to wait for the done() call inside the timeout.
+       done();
+    }, 1000);
+});
+
+QUnit.test("bootstrapComponentAjaxCall adds response content to target_body", function(assert) {
+    // if we don't set a value the test will run endless
+    data_url.value = "something"
+    var modal = $( "#id_modal" );
+    var body = $('#id_modal_body');
+
+    bootstrapComponentAjaxCall( modal[0], body )
+
+    var done = assert.async();
+    setTimeout(function() {
+       assert.notOk($('.django-bootstrap-swt-error').hasClass("d-none"));
+       // Tell QUnit to wait for the done() call inside the timeout.
+       done();
+    }, 1000);
+});
diff --git a/package.json b/package.json
@@ -0,0 +1,31 @@
+{
+  "scripts": {
+    "test": "qunit js_tests/test*"
+  },
+  "devDependencies": {
+    "jquery": "^3.5.1",
+    "qunit": "^2.13.0",
+    "jsdom": "^16.4.0",
+    "bootstrap": "^4.0.0",
+    "popper.js": "^1.16.1"
+  },
+  "bugs": {
+    "url": "https://github.com/jokiefer/django-bootstrap-swt/issues"
+  },
+  "author": {
+    "name": "Jonas Kiefer",
+    "email": "jonas.kiefer@live.com"
+  },
+  "name": "django-bootstrap-swt",
+  "homepage": "https://github.com/jokiefer/django-bootstrap-swt",
+  "license": "GPL-3.0-or-later",
+  "repository": {
+    "url": "https://github.com/jokiefer/django-bootstrap-swt"
+  },
+  "version": "v0.0.0a4",
+  "bin": {
+    "name": "django-bootstrap-swt",
+    "version": "v0.0.0a4",
+    "bin": "../django_bootstrap_swt/static/django_bootstrap_swt/js/django_bootstrap_swt.js"
+  }
+}