Add js unit tests to project.

.github/workflows/moodle-plugin-ci.yml

@@ -33,87 +33,6 @@ jobs:
           - php: '8.1'
             moodle-branch: 'MOODLE_405_STABLE'
             database: pgsql
-          - php: '8.2'
-            moodle-branch: 'MOODLE_405_STABLE'
-            database: pgsql
-          - php: '8.3'
-            moodle-branch: 'MOODLE_405_STABLE'
-            database: pgsql
-          - php: '8.1'
-            moodle-branch: 'MOODLE_405_STABLE'
-            database: mariadb
-          - php: '8.2'
-            moodle-branch: 'MOODLE_405_STABLE'
-            database: mariadb
-          - php: '8.3'
-            moodle-branch: 'MOODLE_405_STABLE'
-            database: mariadb
-          - php: '8.1'
-            moodle-branch: 'MOODLE_404_STABLE'
-            database: pgsql
-          - php: '8.2'
-            moodle-branch: 'MOODLE_404_STABLE'
-            database: pgsql
-          - php: '8.3'
-            moodle-branch: 'MOODLE_404_STABLE'
-            database: pgsql
-          - php: '8.1'
-            moodle-branch: 'MOODLE_404_STABLE'
-            database: mariadb
-          - php: '8.2'
-            moodle-branch: 'MOODLE_404_STABLE'
-            database: mariadb
-          - php: '8.3'
-            moodle-branch: 'MOODLE_404_STABLE'
-            database: mariadb
-          - php: '8.0'
-            moodle-branch: 'MOODLE_403_STABLE'
-            database: pgsql
-          - php: '8.1'
-            moodle-branch: 'MOODLE_403_STABLE'
-            database: pgsql
-          - php: '8.2'
-            moodle-branch: 'MOODLE_403_STABLE'
-            database: pgsql
-          - php: '8.0'
-            moodle-branch: 'MOODLE_403_STABLE'
-            database: mariadb
-          - php: '8.1'
-            moodle-branch: 'MOODLE_403_STABLE'
-            database: mariadb
-          - php: '8.2'
-            moodle-branch: 'MOODLE_403_STABLE'
-            database: mariadb
-          - php: '8.0'
-            moodle-branch: 'MOODLE_402_STABLE'
-            database: pgsql
-          - php: '8.1'
-            moodle-branch: 'MOODLE_402_STABLE'
-            database: pgsql
-          - php: '8.2'
-            moodle-branch: 'MOODLE_402_STABLE'
-            database: pgsql
-          - php: '8.0'
-            moodle-branch: 'MOODLE_402_STABLE'
-            database: mariadb
-          - php: '8.1'
-            moodle-branch: 'MOODLE_402_STABLE'
-            database: mariadb
-          - php: '8.2'
-            moodle-branch: 'MOODLE_402_STABLE'
-            database: mariadb
-          - php: '8.0'
-            moodle-branch: 'MOODLE_401_STABLE'
-            database: pgsql
-          - php: '7.4'
-            moodle-branch: 'MOODLE_401_STABLE'
-            database: pgsql
-          - php: '8.0'
-            moodle-branch: 'MOODLE_401_STABLE'
-            database: mariadb
-          - php: '7.4'
-            moodle-branch: 'MOODLE_401_STABLE'
-            database: mariadb
 
     steps:
       - name: Check out repository code
@@ -145,6 +64,9 @@ jobs:
           DB: ${{ matrix.database }}
           MOODLE_BRANCH: ${{ matrix.moodle-branch }}
 
+      - name: Setup upterm session
+        uses: lhotari/action-upterm@v1 
+
       - name: PHP Lint
         if: ${{ always() }}
         run: moodle-plugin-ci phplint
@@ -181,6 +103,10 @@ jobs:
       - name: PHPUnit tests
         if: ${{ always() }}
         run: moodle-plugin-ci phpunit --fail-on-warning
+
+      - name: JS tests
+        if: ${{ always() }}
+        run: cd /home/runner/work/moodle-tiny_multilang2/moodle-tiny_multilang2/lib/editor/tiny/plugins/multilang2/tests/js && npm install && npm test
 
       - name: Behat features
         if: ${{ always() }}

.gitignore

@@ -1 +1,3 @@
 .idea/
+tests/js/node_modules/
+tests/js/src/

tests/js/htmlparser.test.js

@@ -0,0 +1,56 @@
+import {expect, test} from '@jest/globals';
+import {parseEditorContent} from './src/htmlparser.mjs';
+
+test('html 1', () => {
+    const html = '<p class="clo">{mlang de}</p><div>Foo bar {mlang}</div>';
+    const parsed = '<p class="clo"><span contenteditable="false" class="multilang-begin mceNonEditable" '
+        + 'data-mce-contenteditable="false" lang="de" xml:lang="de">{mlang de}</span>'
+        + '<span contenteditable="false" class="multilang-end mceNonEditable" data-mce-contenteditable="false">{mlang}</span>'
+        + '<div>Foo bar <span contenteditable="false" class="multilang-begin mceNonEditable" data-mce-contenteditable="false" '
+        + 'lang="other" xml:lang="other">{mlang other}</span><span contenteditable="false" class="multilang-end mceNonEditable" '
+        + 'data-mce-contenteditable="false">{mlang}</span>';
+    expect(parseEditorContent(html)).toEqual(parsed);
+});
+
+test('html 2', () => {
+    const html = '<div>Foo bar {mlang}</div>';
+    const parsed = '<div>Foo bar <span contenteditable="false" class="multilang-begin mceNonEditable" '
+        + 'data-mce-contenteditable="false" lang="other" xml:lang="other">{mlang other}</span>'
+        + '<span contenteditable="false" class="multilang-end mceNonEditable" data-mce-contenteditable="false">{mlang}</span>';
+    expect(parseEditorContent(html)).toEqual(parsed);
+});
+
+test('html 3', () => {
+    const html = `<p>{mlang en}This is a test{mlang}{mlang de}Das ist ein Test{mlang}.</p>
+<p>This is a multilang link: <a
+    href="https://google.com?lang={mlang de}de-DE{mlang}{mlang en}en-EN{mlang}" target="_blank">{mlang
+    de}de{mlang}{mlang en}other{mlang}</a></p>
+<p>{mlang de}</p>
+<p>ein Paragraf auf Deutch</p>
+<br><hr strong/>
+<p class="clo">{mlang}</p>
+<p>{mlang other}This is <b>a</b> test{mlang}{mlang de}Das ist ein Test{mlang}.</p>
+<p>{mlang en}This is a test{mlang}{mlang de}Das ist ein Test{mlang}.</p>
+<p><span contenteditable="false" class="multilang-begin mceNonEditable"
+data-mce-contenteditable="false" lang="en" xml:lang="en">{mlang en}</span>English rules<span contenteditable="false" class="multilang-end mceNonEditable" data-mce-contenteditable="false">{mlang}</span></p>`;
+    const parsed = `<p><span contenteditable="false" class="multilang-begin mceNonEditable" data-mce-contenteditable="false" lang="en" xml:lang="en">{mlang en}</span>This is a test<span contenteditable="false" class="multilang-end mceNonEditable" data-mce-contenteditable="false">{mlang}</span><span contenteditable="false" class="multilang-begin mceNonEditable" data-mce-contenteditable="false" lang="de" xml:lang="de">{mlang de}</span>Das ist ein Test<span contenteditable="false" class="multilang-end mceNonEditable" data-mce-contenteditable="false">{mlang}</span>.</p>
+<p>This is a multilang link: <a
+    href="https://google.com?lang={mlang de}de-DE{mlang}{mlang en}en-EN{mlang}" target="_blank"><span contenteditable="false" class="multilang-begin mceNonEditable" data-mce-contenteditable="false" lang="de" xml:lang="de">{mlang de}</span>de<span contenteditable="false" class="multilang-end mceNonEditable" data-mce-contenteditable="false">{mlang}</span><span contenteditable="false" class="multilang-begin mceNonEditable" data-mce-contenteditable="false" lang="en" xml:lang="en">{mlang en}</span>other<span contenteditable="false" class="multilang-end mceNonEditable" data-mce-contenteditable="false">{mlang}</span></a></p>
+<p><span contenteditable="false" class="multilang-begin mceNonEditable" data-mce-contenteditable="false" lang="de" xml:lang="de">{mlang de}</span><span contenteditable="false" class="multilang-end mceNonEditable" data-mce-contenteditable="false">{mlang}</span>
+<p>ein Paragraf auf Deutch</p>
+<br><hr strong/>
+<p class="clo"><span contenteditable="false" class="multilang-begin mceNonEditable" data-mce-contenteditable="false" lang="other" xml:lang="other">{mlang other}</span><span contenteditable="false" class="multilang-end mceNonEditable" data-mce-contenteditable="false">{mlang}</span>
+<p><span contenteditable="false" class="multilang-begin mceNonEditable" data-mce-contenteditable="false" lang="other" xml:lang="other">{mlang other}</span>This is <b>a</b> test{mlang}{mlang de}Das ist ein Test{mlang}.<span contenteditable="false" class="multilang-end mceNonEditable" data-mce-contenteditable="false">{mlang}</span>
+<p><span contenteditable="false" class="multilang-begin mceNonEditable" data-mce-contenteditable="false" lang="en" xml:lang="en">{mlang en}</span>This is a test<span contenteditable="false" class="multilang-end mceNonEditable" data-mce-contenteditable="false">{mlang}</span><span contenteditable="false" class="multilang-begin mceNonEditable" data-mce-contenteditable="false" lang="de" xml:lang="de">{mlang de}</span>Das ist ein Test<span contenteditable="false" class="multilang-end mceNonEditable" data-mce-contenteditable="false">{mlang}</span>.</p>
+<p><span contenteditable="false" class="multilang-begin mceNonEditable"
+data-mce-contenteditable="false" lang="en" xml:lang="en">{mlang en}</span>English rules<span contenteditable="false" class="multilang-end mceNonEditable" data-mce-contenteditable="false">{mlang}</span></p>`;
+    expect(parseEditorContent(html)).toEqual(parsed);
+});
+test('html 4', () => {
+    const html = `<p><span contenteditable="false" class="multilang-begin mceNonEditable"
+data-mce-contenteditable="false" lang="en" xml:lang="en">{mlang en}</span>English rules<span contenteditable="false" class="multilang-end mceNonEditable" data-mce-contenteditable="false">{mlang}</span></p>`;
+    const parsed = '<p><span contenteditable="false" class="multilang-begin mceNonEditable"\n'
+        + 'data-mce-contenteditable="false" lang="en" xml:lang="en">{mlang en}</span>English rules<span '
+        + 'contenteditable="false" class="multilang-end mceNonEditable" data-mce-contenteditable="false">{mlang}</span></p>';
+    expect(parseEditorContent(html)).toEqual(parsed);
+});

tests/js/package.json

@@ -0,0 +1,18 @@
+{
+    "type": "module",
+    "devDependencies": {
+        "jest": "^29.7.0"
+    },
+    "scripts": {
+        "cpsrc": "mkdir -p src && for i in ../../amd/src/*.js ; do t=${i##*/}; x=${t%*.js}; cp $i src/${x}.mjs; done",
+        "jest": "node --experimental-vm-modules ./node_modules/.bin/jest",
+        "test": "npm run cpsrc && npm run jest"
+    },
+    "jest": {
+        "verbose": true,
+        "testMatch": [
+            "**/*.test.js"
+        ],
+        "transform": {}
+    }
+}