github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-25 17:57:24 +08:00
Code Issues Actions 6 Packages Projects Releases Wiki Activity

FIX: Rendering a single item in a grid (#24464)

Browse Source 
Should fix https://meta.discourse.org/t/-/285768.

Appending without cloning was causing the item to be removed from the
DOM but on a 1-item grid we skip the rest of the grid's rendering,
hence the item was never re-inserted. Cloning ensures we don't remove
the item during processing (it does get removed later on when rendering
the grid's columns).
This commit is contained in:
Penar Musaraj 2023-11-20 11:53:35 -05:00 committed by GitHub
parent 89bd2b7df0
commit f8a27dcbec
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 31 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/assets/javascripts/discourse/app/lib/columns.js
View File

@ -85,7 +85,7 @@ export default class Columns {
const wrapper = document.createElement("span");
wrapper.classList.add("image-wrapper");
wrapper.append(item);
wrapper.appendChild(item.cloneNode());
return wrapper;
}

30
app/assets/javascripts/discourse/tests/unit/lib/columns-test.js
View File

@ -154,4 +154,34 @@ module("Unit | Columns", function (hooks) {
"one element in column 3"
);
});
test("renders a single item in a P tag", function (assert) {
document.getElementById(
"qunit-fixture"
).innerHTML = `<div class="d-image-grid">
<p><img src="/images/avatar.png" alt role="presentation"></p>
</div>`;
const grid = document.querySelector(".d-image-grid");
const cols = new Columns(grid);
assert.strictEqual(cols.items.length, 1);
assert.strictEqual(
grid.dataset.disabled,
"true",
"disabled attribute is added"
);
assert.strictEqual(
document.querySelectorAll(".d-image-grid > .d-image-grid-column").length,
0,
"no column elements are rendered"
);
assert.strictEqual(
document.querySelectorAll(".d-image-grid > p > img").length,
1,
"an image element is rendered"
);
});
});