From f3b4a2948eb7e8098d88472aee9ebe48b0b22dd5 Mon Sep 17 00:00:00 2001 From: Antoine Guenet Date: Mon, 27 Feb 2023 10:34:49 +0000 Subject: [PATCH] [REF] web_editor: abstract convert to grid tests, remove jquery This removes calls to JQuery in the convert to grid tests and the functions they test. In the process, these tests are abstracted for better readability and maintainability. closes odoo/odoo#113784 X-original-commit: 3eafc2d3425365bfb25b0540de95aab4e7d89ebf Signed-off-by: David Monjoie (dmo) --- .../static/src/js/backend/convert_inline.js | 21 +- .../static/tests/convert_inline_tests.js | 347 ++++++++++-------- 2 files changed, 194 insertions(+), 174 deletions(-) diff --git a/addons/web_editor/static/src/js/backend/convert_inline.js b/addons/web_editor/static/src/js/backend/convert_inline.js index 53ab2e47204..8f602d793a2 100644 --- a/addons/web_editor/static/src/js/backend/convert_inline.js +++ b/addons/web_editor/static/src/js/backend/convert_inline.js @@ -103,10 +103,9 @@ function attachmentThumbnailToLinkImg($editable) { * support the mixing and matching of column options (e.g., "col-4 col-sm-6" and * "col col-4" aren't supported). * - * @param {JQuery} $editable + * @param {Element} editable */ -function bootstrapToTable($editable) { - const editable = $editable.get(0); +function bootstrapToTable(editable) { // First give all rows in columns a separate container parent. for (const rowInColumn of [...editable.querySelectorAll('.row')].filter(row => RE_COL_MATCH.test(row.parentElement.className))) { const previous = rowInColumn.previousElementSibling; @@ -291,10 +290,9 @@ function bootstrapToTable($editable) { /** * Convert Bootstrap cards to table structures. * - * @param {JQuery} $editable + * @param {Element} editable */ -function cardToTable($editable) { - const editable = $editable.get(0); +function cardToTable(editable) { for (const card of editable.querySelectorAll('.card')) { const table = _createTable(card.attributes); table.style.removeProperty('overflow'); @@ -598,9 +596,9 @@ async function toInline($editable, cssRules, $iframe) { fontToImg($editable); await svgToPng($editable); classToStyle($editable, cssRules); - bootstrapToTable($editable); - cardToTable($editable); - listGroupToTable($editable); + bootstrapToTable(editable); + cardToTable(editable); + listGroupToTable(editable); addTables($editable); normalizeColors($editable); const rootFontSizeProperty = getComputedStyle(editable.ownerDocument.documentElement).fontSize; @@ -931,10 +929,9 @@ function getCSSRules(doc) { /** * Convert Bootstrap list groups and their items to table structures. * - * @param {JQuery} $editable + * @param {Element} editable */ -function listGroupToTable($editable) { - const editable = $editable.get(0); +function listGroupToTable(editable) { for (const listGroup of editable.querySelectorAll('.list-group')) { let table; if (listGroup.querySelectorAll('.list-group-item').length) { diff --git a/addons/web_editor/static/tests/convert_inline_tests.js b/addons/web_editor/static/tests/convert_inline_tests.js index 20de7775de3..ab73b76ad01 100644 --- a/addons/web_editor/static/tests/convert_inline_tests.js +++ b/addons/web_editor/static/tests/convert_inline_tests.js @@ -8,9 +8,16 @@ const TEST_HEIGHT = 600; QUnit.module('web_editor', {}, function () { QUnit.module('convert_inline', {}, function () { QUnit.module('Convert Bootstrap grids to tables', { - beforeEach: function () { - this.$editable = $(`
`); - $('#qunit-fixture').append(this.$editable); + beforeEach: function (assert) { + this.editable = document.createElement('div'); + this.editable.style.setProperty('width', TEST_WIDTH + 'px'); + this.editable.style.setProperty('height', TEST_HEIGHT + 'px'); + document.querySelector('#qunit-fixture').append(this.editable); + this.testConvertGrid = ({ before, after, title, stepFunction }) => { + this.editable.innerHTML = before; + (stepFunction || convertInline.bootstrapToTable)(this.editable); + assert.strictEqual(removeComments(this.editable.innerHTML), after, title); + } } }); // Test bootstrapToTable, cardToTable and listGroupToTable @@ -19,260 +26,275 @@ QUnit.module('convert_inline', {}, function () { assert.expect(4); // 1x1 - this.$editable.html(getRegularGridHtml(1, 1)); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), getRegularTableHtml(1, 1, 12, 100, TEST_WIDTH), - "should have converted a 1x1 grid to an equivalent table"); + this.testConvertGrid({ + before: getRegularGridHtml(1, 1), + after: getRegularTableHtml(1, 1, 12, 100, TEST_WIDTH), + title: "should have converted a 1x1 grid to an equivalent table", + }); // 1x2 - this.$editable.html(getRegularGridHtml(1, 2)); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), getRegularTableHtml(1, 2, 6, 50, TEST_WIDTH), - "should have converted a 1x2 grid to an equivalent table"); + this.testConvertGrid({ + before: getRegularGridHtml(1, 2), + after: getRegularTableHtml(1, 2, 6, 50, TEST_WIDTH), + title: "should have converted a 1x2 grid to an equivalent table", + }); // 1x3 - this.$editable.html(getRegularGridHtml(1, 3)); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), getRegularTableHtml(1, 3, 4, 33.33, TEST_WIDTH), - "should have converted a 1x3 grid to an equivalent table"); + this.testConvertGrid({ + before: getRegularGridHtml(1, 3), + after: getRegularTableHtml(1, 3, 4, 33.33, TEST_WIDTH), + title: "should have converted a 1x3 grid to an equivalent table", + }); // 1x12 - this.$editable.html(getRegularGridHtml(1, 12)); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), getRegularTableHtml(1, 12, 1, 8.33, TEST_WIDTH), - "should have converted a 1x12 grid to an equivalent table"); + this.testConvertGrid({ + before: getRegularGridHtml(1, 12), + after: getRegularTableHtml(1, 12, 1, 8.33, TEST_WIDTH), + title: "should have converted a 1x12 grid to an equivalent table", + }); }); QUnit.test('convert a single-row regular overflowing grid', async function (assert) { assert.expect(4); // 1x13 - this.$editable.html(getRegularGridHtml(1, 13)); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), - getRegularTableHtml(1, 12, 1, 8.33, TEST_WIDTH).slice(0, -8) + + this.testConvertGrid({ + before: getRegularGridHtml(1, 13), + after: getRegularTableHtml(1, 12, 1, 8.33, TEST_WIDTH).slice(0, -8) + `` + getTdHtml(1, '(0, 12)', TEST_WIDTH) + getTdHtml(11, '', TEST_WIDTH) + ``, - "should have converted a 1x13 grid to an equivalent table (overflowing)"); + title: "should have converted a 1x13 grid to an equivalent table (overflowing)", + }); // 1x14 - this.$editable.html(getRegularGridHtml(1, 14)); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), - getRegularTableHtml(1, 12, 1, 8.33, TEST_WIDTH).slice(0, -8) + + this.testConvertGrid({ + before: getRegularGridHtml(1, 14), + after: getRegularTableHtml(1, 12, 1, 8.33, TEST_WIDTH).slice(0, -8) + `` + getTdHtml(1, '(0, 12)', TEST_WIDTH) + getTdHtml(1, '(0, 13)', TEST_WIDTH) + getTdHtml(10, '', TEST_WIDTH) + ``, - "should have converted a 1x14 grid to an equivalent table (overflowing)"); + title: "should have converted a 1x14 grid to an equivalent table (overflowing)", + }); // 1x25 - this.$editable.html(getRegularGridHtml(1, 25)); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), - getRegularTableHtml(1, 12, 1, 8.33, TEST_WIDTH).slice(0, -8) + - getRegularTableHtml(1, 12, 1, 8.33, TEST_WIDTH).replace(/\(0, (\d+)\)/g, (s, c) => `(0, ${+c + 12})`) - .replace(/^/, '').slice(0, -8) + + this.testConvertGrid({ + before: getRegularGridHtml(1, 25), + after: getRegularTableHtml(1, 12, 1, 8.33, TEST_WIDTH).slice(0, -8) + + getRegularTableHtml(1, 12, 1, 8.33, TEST_WIDTH).replace(/\(0, (\d+)\)/g, (s, c) => `(0, ${+c + 12})`) + .replace(/^/, '').slice(0, -8) + `` + getTdHtml(1, '(0, 24)', TEST_WIDTH) + getTdHtml(11, '', TEST_WIDTH) + ``, - "should have converted a 1x25 grid to an equivalent table (overflowing)"); + title: "should have converted a 1x25 grid to an equivalent table (overflowing)", + }); // 1x26 - this.$editable.html(getRegularGridHtml(1, 26)); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), - getRegularTableHtml(1, 12, 1, 8.33, TEST_WIDTH).slice(0, -8) + - getRegularTableHtml(1, 12, 1, 8.33, TEST_WIDTH).replace(/\(0, (\d+)\)/g, (s, c) => `(0, ${+c + 12})`) - .replace(/^/, '').slice(0, -8) + + this.testConvertGrid({ + before: getRegularGridHtml(1, 26), + after: getRegularTableHtml(1, 12, 1, 8.33, TEST_WIDTH).slice(0, -8) + + getRegularTableHtml(1, 12, 1, 8.33, TEST_WIDTH).replace(/\(0, (\d+)\)/g, (s, c) => `(0, ${+c + 12})`) + .replace(/^/, '').slice(0, -8) + `` + getTdHtml(1, '(0, 24)', TEST_WIDTH) + getTdHtml(1, '(0, 25)', TEST_WIDTH) + getTdHtml(10, '', TEST_WIDTH) + ``, - "should have converted a 1x26 grid to an equivalent table (overflowing)"); + title: "should have converted a 1x26 grid to an equivalent table (overflowing)", + }); }); QUnit.test('convert a multi-row regular grid', async function (assert) { assert.expect(4); // 2x1 - this.$editable.html(getRegularGridHtml(2, 1)); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), getRegularTableHtml(2, 1, 12, 100, TEST_WIDTH), - "should have converted a 2x1 grid to an equivalent table"); + this.testConvertGrid({ + before: getRegularGridHtml(2, 1), + after: getRegularTableHtml(2, 1, 12, 100, TEST_WIDTH), + title: "should have converted a 2x1 grid to an equivalent table", + }); // 2x[1,2] - this.$editable.html(getRegularGridHtml(2, [1, 2])); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), getRegularTableHtml(2, [1, 2], [12, 6], [100, 50], TEST_WIDTH), - "should have converted a 2x[1,2] grid to an equivalent table"); + this.testConvertGrid({ + before: getRegularGridHtml(2, [1, 2]), + after: getRegularTableHtml(2, [1, 2], [12, 6], [100, 50], TEST_WIDTH), + title: "should have converted a 2x[1,2] grid to an equivalent table", + }); // 3x3 - this.$editable.html(getRegularGridHtml(3, 3)); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), getRegularTableHtml(3, 3, 4, 33.33, TEST_WIDTH), - "should have converted a 3x3 grid to an equivalent table"); + this.testConvertGrid({ + before: getRegularGridHtml(3, 3), + after: getRegularTableHtml(3, 3, 4, 33.33, TEST_WIDTH), + title: "should have converted a 3x3 grid to an equivalent table", + }); // 3x[3,2,1] - this.$editable.html(getRegularGridHtml(3, [3,2,1])); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), getRegularTableHtml(3, [3, 2, 1], [4, 6, 12], [33.33, 50, 100], TEST_WIDTH), - "should have converted a 3x[3,2,1] grid to an equivalent table"); + this.testConvertGrid({ + before: getRegularGridHtml(3, [3,2,1]), + after: getRegularTableHtml(3, [3, 2, 1], [4, 6, 12], [33.33, 50, 100], TEST_WIDTH), + title: "should have converted a 3x[3,2,1] grid to an equivalent table", + }); }); QUnit.test('convert a multi-row regular overflowing grid', async function (assert) { assert.expect(4); // 2x[13,1] - this.$editable.html(getRegularGridHtml(2, [13, 1])); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), - getRegularTableHtml(1, 12, 1, 8.33, TEST_WIDTH).slice(0, -8) + + this.testConvertGrid({ + before: getRegularGridHtml(2, [13, 1]), + after: getRegularTableHtml(1, 12, 1, 8.33, TEST_WIDTH).slice(0, -8) + `` + getTdHtml(1, '(0, 12)', TEST_WIDTH) + getTdHtml(11, '', TEST_WIDTH) + // 13 overflowed the row by 1 -> fill up `` + `${getTdHtml(12, '(1, 0)', TEST_WIDTH)}`, // 1 col with no size == col-12 - "should have converted a 2x[13,1] grid to an equivalent table (overflowing)"); + title: "should have converted a 2x[13,1] grid to an equivalent table (overflowing)", + }); // 2x[1,13] - this.$editable.html(getRegularGridHtml(2, [1, 13])); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(this.$editable.html(), - getRegularTableHtml(2, [1, 12], [12, 1], [100, 8.33], TEST_WIDTH).slice(0, -8) + + this.testConvertGrid({ + before: getRegularGridHtml(2, [1, 13]), + after: getRegularTableHtml(2, [1, 12], [12, 1], [100, 8.33], TEST_WIDTH).slice(0, -8) + `` + getTdHtml(1, '(1, 12)', TEST_WIDTH) + getTdHtml(11, '', TEST_WIDTH) + // 13 overflowed the row by 1 -> fill up ``, - "should have converted a 2x[1,13] grid to an equivalent table (overflowing)"); + title: "should have converted a 2x[1,13] grid to an equivalent table (overflowing)", + }); // 3x[1,13,6] - this.$editable.html(getRegularGridHtml(3, [1, 13, 6])); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(this.$editable.html(), - getRegularTableHtml(2, [1, 12], [12, 1], [100, 8.33], TEST_WIDTH).slice(0, -8) + + this.testConvertGrid({ + before: getRegularGridHtml(3, [1, 13, 6]), + after: getRegularTableHtml(2, [1, 12], [12, 1], [100, 8.33], TEST_WIDTH).slice(0, -8) + `` + getTdHtml(1, '(1, 12)', TEST_WIDTH) + getTdHtml(11, '', TEST_WIDTH) + // 13 overflowed the row by 1 -> fill up `` + getRegularTableHtml(1, 6, 2, 16.67, TEST_WIDTH).replace(/\(0,/g, `(2,`).replace(/^/, ''), - "should have converted a 3x[1,13,6] grid to an equivalent table (overflowing)"); + title: "should have converted a 3x[1,13,6] grid to an equivalent table (overflowing)", + }); // 3x[1,6,13] - this.$editable.html(getRegularGridHtml(3, [1, 6, 13])); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(this.$editable.html(), - getRegularTableHtml(3, [1, 6, 12], [12, 2, 1], [100, 16.67, 8.33], TEST_WIDTH).slice(0, -8) + + this.testConvertGrid({ + before: getRegularGridHtml(3, [1, 6, 13]), + after: getRegularTableHtml(3, [1, 6, 12], [12, 2, 1], [100, 16.67, 8.33], TEST_WIDTH).slice(0, -8) + `` + getTdHtml(1, '(2, 12)', TEST_WIDTH) + getTdHtml(11, '', TEST_WIDTH) + // 13 overflowed the row by 1 -> fill up ``, - "should have converted a 3x[1,6,13] grid to an equivalent table (overflowing)"); + title: "should have converted a 3x[1,6,13] grid to an equivalent table (overflowing)", + }); }); QUnit.test('convert a single-row irregular grid', async function (assert) { assert.expect(2); // 1x2 - this.$editable.html(getGridHtml([[8, 4]])); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), getTableHtml([[[8, 66.67], [4, 33.33]]], TEST_WIDTH), - "should have converted a 1x2 irregular grid to an equivalent table"); + this.testConvertGrid({ + before: getGridHtml([[8, 4]]), + after: getTableHtml([[[8, 66.67], [4, 33.33]]], TEST_WIDTH), + title: "should have converted a 1x2 irregular grid to an equivalent table", + }); // 1x3 - this.$editable.html(getGridHtml([[2, 3, 7]])); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), getTableHtml([[[2, 16.67], [3, 25], [7, 58.33]]], TEST_WIDTH), - "should have converted a 1x3 grid to an equivalent table"); + this.testConvertGrid({ + before: getGridHtml([[2, 3, 7]]), + after: getTableHtml([[[2, 16.67], [3, 25], [7, 58.33]]], TEST_WIDTH), + title: "should have converted a 1x3 grid to an equivalent table", + }); }); QUnit.test('convert a single-row irregular overflowing grid', async function (assert) { assert.expect(2); // 1x2 - this.$editable.html(getGridHtml([[8, 5]])); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), getTableHtml([ + this.testConvertGrid({ + before: getGridHtml([[8, 5]]), + after: getTableHtml([ [[8, 66.67], [4, 33.33, '']], [[5, 41.67, '(0, 1)'], [7, 58.33, '']], ], TEST_WIDTH), - "should have converted a 1x2 irregular overflowing grid to an equivalent table"); + title: "should have converted a 1x2 irregular overflowing grid to an equivalent table", + }); // 1x3 - this.$editable.html(getGridHtml([[7, 6, 9]])); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), getTableHtml([ + this.testConvertGrid({ + before: getGridHtml([[7, 6, 9]]), + after: getTableHtml([ [[7, 58.33], [5, 41.67, '']], [[6, 50, '(0, 1)'], [6, 50, '']], [[9, 75, '(0, 2)'], [3, 25, '']], ], TEST_WIDTH), - "should have converted a 1x3 irregular overflowing grid to an equivalent table"); + title: "should have converted a 1x3 irregular overflowing grid to an equivalent table", + }); }); QUnit.test('convert a multi-row irregular grid', async function (assert) { assert.expect(2); // 2x2 - this.$editable.html(getGridHtml([[1, 11], [2, 10]])); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), getTableHtml([[[1, 8.33], [11, 91.67]], [[2, 16.67], [10, 83.33]]], TEST_WIDTH), - "should have converted a 2x2 irregular grid to an equivalent table"); + this.testConvertGrid({ + before: getGridHtml([[1, 11], [2, 10]]), + after: getTableHtml([[[1, 8.33], [11, 91.67]], [[2, 16.67], [10, 83.33]]], TEST_WIDTH), + title: "should have converted a 2x2 irregular grid to an equivalent table", + }); // 2x[2,3] - this.$editable.html(getGridHtml([[3, 9], [4, 6, 2]])); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), getTableHtml([[[3, 25], [9, 75]], [[4, 33.33], [6, 50], [2, 16.67]]], TEST_WIDTH), - "should have converted a 2x[2,3] irregular grid to an equivalent table"); + this.testConvertGrid({ + before: getGridHtml([[3, 9], [4, 6, 2]]), + after: getTableHtml([[[3, 25], [9, 75]], [[4, 33.33], [6, 50], [2, 16.67]]], TEST_WIDTH), + title: "should have converted a 2x[2,3] irregular grid to an equivalent table", + }); }); QUnit.test('convert a multi-row irregular overflowing grid', async function (assert) { assert.expect(3); // 2x2 (both rows overflow) - this.$editable.html(getGridHtml([[6, 8], [7, 9]])); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), - getTableHtml([ + this.testConvertGrid({ + before: getGridHtml([[6, 8], [7, 9]]), + after: getTableHtml([ [[6, 50], [6, 50, '']], [[8, 66.67, '(0, 1)'], [4, 33.33, '']], [[7, 58.33, '(1, 0)'], [5, 41.67, '']], [[9, 75, '(1, 1)'], [3, 25, '']], ], TEST_WIDTH), - "should have converted a 2x[1,13] irregular grid to an equivalent table (both rows overflowing)"); + title: "should have converted a 2x[1,13] irregular grid to an equivalent table (both rows overflowing)", + }); // 2x[2,3] (first row overflows) - this.$editable.html(getGridHtml([[5, 8], [4, 2, 6]])); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), - getTableHtml([ + this.testConvertGrid({ + before: getGridHtml([[5, 8], [4, 2, 6]]), + after: getTableHtml([ [[5, 41.67], [7, 58.33, '']], [[8, 66.67, '(0, 1)'], [4, 33.33, '']], [[4, 33.33, '(1, 0)'], [2, 16.67, '(1, 1)'], [6, 50, '(1, 2)']], ], TEST_WIDTH), - "should have converted a 2x[2,3] irregular grid to an equivalent table (first row overflowing)"); + title: "should have converted a 2x[2,3] irregular grid to an equivalent table (first row overflowing)", + }); // 2x[3,2] (second row overflows) - this.$editable.html(getGridHtml([[4, 2, 6], [5, 8]])); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(removeComments(this.$editable.html()), - getTableHtml([ + this.testConvertGrid({ + before: getGridHtml([[4, 2, 6], [5, 8]]), + after: getTableHtml([ [[4, 33.33], [2, 16.67], [6, 50]], [[5, 41.67], [7, 58.33, '']], [[8, 66.67, '(1, 1)'], [4, 33.33, '']], ], TEST_WIDTH), - "should have converted a 2x[3,2] irregular grid to an equivalent table (second row overflowing)"); + title: "should have converted a 2x[3,2] irregular grid to an equivalent table (second row overflowing)", + }); }); QUnit.test('convert a card to a table', async function (assert) { assert.expect(1); - this.$editable.html( - `
` + - `
` + - `HEADER` + - `
` + - `
` + - `

TITLE

` + - `BODY ` + - `
` + - `
` + - `FOOTER` + - `
` + - `
`); - convertInline.cardToTable(this.$editable); - assert.strictEqual(this.$editable.html(), - getRegularTableHtml(3, 1, 12, 100) + this.testConvertGrid({ + title: "should have converted a card structure into a table", + before: + `
` + + `
` + + `HEADER` + + `
` + + `
` + + `

TITLE

` + + `BODY ` + + `
` + + `
` + + `FOOTER` + + `
` + + `
`, + stepFunction: convertInline.cardToTable, + after: getRegularTableHtml(3, 1, 12, 100) .replace('role=\"presentation\"', 'role=\"presentation\" class=\"card\"') .replace(/]*>\(0, 0\)<\/td>/, `` + @@ -295,50 +317,51 @@ QUnit.module('convert_inline', {}, function () { `font-size: unset; line-height: unset;\">` + `FOOTER` + ``), - "should have converted a card structure into a table"); + }); }); QUnit.test('convert a list group to a table', async function (assert) { assert.expect(1); - this.$editable.html( - `
    ` + - `
  • ` + - `(0, 0)` + - `
    • ` + - `
  • ` + - `(1, 0)` + - `
    • ` + - `
    • ` + - `
  • ` + - `(2, 0)` + - `
    • ` + - `
`); - convertInline.listGroupToTable(this.$editable); - assert.strictEqual(this.$editable.html(), - getRegularTableHtml(3, 1, 12, 100) + this.testConvertGrid({ + title: "should have converted a list group structure into a table", + before: + `
    ` + + `
  • ` + + `(0, 0)` + + `
    • ` + + `
  • ` + + `(1, 0)` + + `
    • ` + + `
    • ` + + `
  • ` + + `(2, 0)` + + `
    • ` + + `
`, + stepFunction: convertInline.listGroupToTable, + after: getRegularTableHtml(3, 1, 12, 100) .split('style="').join('class="list-group-flush" style="') .replace(/]*>(\(0, 0\))<\/td>/, '$1') .replace(/]*>(\(1, 0\))<\/td>/, '$1') .replace(/]*>(\(2, 0\))<\/td>/, '$1'), - "should have converted a list group structure into a table"); + }); }); QUnit.test('convert a grid with offsets to a table', async function (assert) { assert.expect(2); - this.$editable.html('
(0, 0)
'); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(this.$editable.html(), - getTableHtml([[[4, 33.33, ''], [6, 50, '(0, 0)'], [2, 16.67, '']]], TEST_WIDTH), - "should have converted a column with an offset to two columns, then completed the column"); + this.testConvertGrid({ + before: '
(0, 0)
', + after: getTableHtml([[[4, 33.33, ''], [6, 50, '(0, 0)'], [2, 16.67, '']]], TEST_WIDTH), + title: "should have converted a column with an offset to two columns, then completed the column", + }); - this.$editable.html('
(0, 0)
(0, 1)
'); - convertInline.bootstrapToTable(this.$editable); - assert.strictEqual(this.$editable.html(), - getTableHtml([ + this.testConvertGrid({ + before: '
(0, 0)
(0, 1)
', + after: getTableHtml([ [[4, 33.33, ''], [6, 50, '(0, 0)'], [1, 8.33, ''], [1, 8.33, '']], [[6, 50, '(0, 1)'], [6, 50, '']] ], TEST_WIDTH), - "should have converted a column with an offset to two columns, then completed the column (overflowing)"); + title: "should have converted a column with an offset to two columns, then completed the column (overflowing)", + }); }); QUnit.module('Normalize styles');