github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-23 19:37:55 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

DEV: Allow utility class domFromString to take in strings with multiple top level elements (#15548)

Browse Source 
Previously only `<div>one top element</div>` was allowed because we use `firstChild` instead of `children`.
We also want `<div>one</div><div>two</div>` to work with this method.
This commit is contained in:
Natalie Tay 2022-01-12 19:49:24 +08:00 committed by GitHub
parent 252bb87ab3
commit dd3ed27930
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 17 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/assets/javascripts/discourse-common/addon/lib/dom-from-string.js
View File

@ -2,5 +2,5 @@ export default function domFromString(string) {
const template = document.createElement("template");
string = string.trim();
template.innerHTML = string;
return template.content.firstChild;
return template.content.children;
}

7
app/assets/javascripts/discourse/tests/unit/lib/dom-from-string-test.js
View File

@ -4,7 +4,10 @@ import domFromString from "discourse-common/lib/dom-from-string";
discourseModule("Unit | Utility | domFromString", function () {
test("constructing DOM node from a string", function (assert) {
const node = domFromString('<div class="foo">foo</div>');
assert.ok(node.classList.contains("foo"));
const node = domFromString(
'<div class="foo">foo</div><div class="boo">boo</div>'
);
assert.ok(node[0].classList.contains("foo"));
assert.ok(node[1].classList.contains("boo"));
});
});

18
app/assets/javascripts/discourse/tests/unit/lib/formatter-test.js
View File

@ -38,7 +38,7 @@ function shortDateTester(format) {
}
function strip(html) {
return domFromString(html).innerText;
return domFromString(html)[0].innerText;
}
discourseModule("Unit | Utility | formatter", function (hooks) {
@ -121,12 +121,12 @@ discourseModule("Unit | Utility | formatter", function (hooks) {
);
assert.strictEqual(
domFromString(formatDays(0, { format: "medium" })).title,
domFromString(formatDays(0, { format: "medium" }))[0].title,
longDate(new Date())
);
assert.ok(
domFromString(formatDays(0, { format: "medium" })).classList.contains(
domFromString(formatDays(0, { format: "medium" }))[0].classList.contains(
"date"
)
);
@ -226,12 +226,12 @@ discourseModule("Unit | Utility | formatter", function (hooks) {
test("autoUpdatingRelativeAge", function (assert) {
let d = moment().subtract(1, "day").toDate();
let elem = domFromString(autoUpdatingRelativeAge(d));
let elem = domFromString(autoUpdatingRelativeAge(d))[0];
assert.strictEqual(elem.dataset.format, "tiny");
assert.strictEqual(elem.dataset.time, d.getTime().toString());
assert.strictEqual(elem.title, "");
elem = domFromString(autoUpdatingRelativeAge(d, { title: true }));
elem = domFromString(autoUpdatingRelativeAge(d, { title: true }))[0];
assert.strictEqual(elem.title, longDate(d));
elem = domFromString(
@ -240,14 +240,14 @@ discourseModule("Unit | Utility | formatter", function (hooks) {
title: true,
leaveAgo: true,
})
);
)[0];
assert.strictEqual(elem.dataset.format, "medium-with-ago");
assert.strictEqual(elem.dataset.time, d.getTime().toString());
assert.strictEqual(elem.title, longDate(d));
assert.strictEqual(elem.innerHTML, "1 day ago");
elem = domFromString(autoUpdatingRelativeAge(d, { format: "medium" }));
elem = domFromString(autoUpdatingRelativeAge(d, { format: "medium" }))[0];
assert.strictEqual(elem.dataset.format, "medium");
assert.strictEqual(elem.dataset.time, d.getTime().toString());
assert.strictEqual(elem.title, "");
@ -256,7 +256,7 @@ discourseModule("Unit | Utility | formatter", function (hooks) {
test("updateRelativeAge", function (assert) {
let d = new Date();
let elem = domFromString(autoUpdatingRelativeAge(d));
let elem = domFromString(autoUpdatingRelativeAge(d))[0];
elem.dataset.time = d.getTime() - 2 * 60 * 1000;
updateRelativeAge(elem);
@ -266,7 +266,7 @@ discourseModule("Unit | Utility | formatter", function (hooks) {
d = new Date();
elem = domFromString(
autoUpdatingRelativeAge(d, { format: "medium", leaveAgo: true })
);
)[0];
elem.dataset.time = d.getTime() - 2 * 60 * 1000;
updateRelativeAge(elem);

2
app/assets/javascripts/discourse/tests/unit/lib/link-mentions-test.js
View File

@ -40,7 +40,7 @@ module("Unit | Utility | link-mentions", function () {
<span class="mention">@valid_group</span>
<span class="mention">@mentionable_group</span>
</div>
`);
`)[0];
await linkSeenMentions(root);
// Ember.Test.registerWaiter is not available here, so we are implementing

2
app/assets/javascripts/pretty-text/addon/oneboxer.js
View File

@ -76,7 +76,7 @@ function loadNext(ajax) {
})
.then(
(template) => {
const node = domFromString(template);
const node = domFromString(template)[0];
setLocalCache(normalize(url), node);
elem.replaceWith(node);
applySquareGenericOnebox(node);