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

DEV: Use document.body directly (#25417)

Browse Source 
No need to fire up those query parsing engines :P
This commit is contained in:
Jarek Radosz 2024-01-25 12:50:33 +01:00 committed by GitHub
parent 1651d63204
commit 5734066942
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 17 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/assets/javascripts/discourse/app/controllers/application.js
View File

@ -60,7 +60,7 @@ export default Controller.extend({
}, },
_mainOutletAnimate() { _mainOutletAnimate() {
document.querySelector("body").classList.remove("sidebar-animate"); document.body.classList.remove("sidebar-animate");
}, },
@discourseComputed( @discourseComputed(
@ -110,7 +110,7 @@ export default Controller.extend({
@action @action
toggleSidebar() { toggleSidebar() {
// enables CSS transitions, but not on did-insert // enables CSS transitions, but not on did-insert
document.querySelector("body").classList.add("sidebar-animate"); document.body.classList.add("sidebar-animate");
discourseDebounce(this, this._mainOutletAnimate, 250); discourseDebounce(this, this._mainOutletAnimate, 250);

5
app/assets/javascripts/discourse/app/instance-initializers/narrow-desktop.js
View File

@ -35,10 +35,7 @@ export default {
} }
}); });
const bodyElement = document.querySelector("body"); this._resizeObserver.observe(document.body);
if (bodyElement) {
this._resizeObserver.observe(bodyElement);
}
} }
}, },
}; };

10
app/assets/javascripts/discourse/app/lib/lock-on.js
View File

@ -84,18 +84,16 @@ export default class LockOn {
} }
_addListener() { _addListener() {
const body = document.querySelector("body");
SCROLL_EVENTS.forEach((event) => { SCROLL_EVENTS.forEach((event) => {
body.addEventListener(event, this._scrollListener, { passive: true }); document.body.addEventListener(event, this._scrollListener, {
passive: true,
});
}); });
} }
_removeListener() { _removeListener() {
const body = document.querySelector("body");
SCROLL_EVENTS.forEach((event) => { SCROLL_EVENTS.forEach((event) => {
body.removeEventListener(event, this._scrollListener); document.body.removeEventListener(event, this._scrollListener);
}); });
} }

20
app/assets/javascripts/discourse/tests/acceptance/sidebar-narrow-desktop-test.js
View File

@ -10,6 +10,10 @@ acceptance("Sidebar - Narrow Desktop", function (needs) {
navigation_menu: "sidebar", navigation_menu: "sidebar",
}); });
needs.hooks.afterEach(function () {
document.body.style.width = null;
});
test("wide sidebar is changed to cloak when resize to narrow screen", async function (assert) { test("wide sidebar is changed to cloak when resize to narrow screen", async function (assert) {
await visit("/"); await visit("/");
assert.ok(exists("#d-sidebar"), "wide sidebar is displayed"); assert.ok(exists("#d-sidebar"), "wide sidebar is displayed");
@ -22,8 +26,7 @@ acceptance("Sidebar - Narrow Desktop", function (needs) {
assert.ok(exists("#d-sidebar"), "wide sidebar is displayed"); assert.ok(exists("#d-sidebar"), "wide sidebar is displayed");
const bodyElement = document.querySelector("body"); document.body.style.width = "767px";
bodyElement.style.width = "767px";
await waitFor(".btn-sidebar-toggle.narrow-desktop", { await waitFor(".btn-sidebar-toggle.narrow-desktop", {
timeout: 5000, timeout: 5000,
@ -41,34 +44,31 @@ acceptance("Sidebar - Narrow Desktop", function (needs) {
"cloak sidebar is collapsed" "cloak sidebar is collapsed"
); );
bodyElement.style.width = "1200px"; document.body.style.width = "1200px";
await waitFor("#d-sidebar", { await waitFor("#d-sidebar", {
timeout: 5000, timeout: 5000,
}); });
assert.ok(exists("#d-sidebar"), "wide sidebar is displayed"); assert.ok(exists("#d-sidebar"), "wide sidebar is displayed");
bodyElement.style.width = null;
}); });
test("transition from narrow screen to wide screen", async function (assert) { test("transition from narrow screen to wide screen", async function (assert) {
await visit("/"); await visit("/");
const bodyElement = document.querySelector("body"); document.body.style.width = "767px";
bodyElement.style.width = "767px";
await waitFor(".btn-sidebar-toggle.narrow-desktop", { await waitFor(".btn-sidebar-toggle.narrow-desktop", {
timeout: 5000, timeout: 5000,
}); });
await click(".btn-sidebar-toggle"); await click(".btn-sidebar-toggle");
bodyElement.style.width = "1200px"; document.body.style.width = "1200px";
await waitFor("#d-sidebar", { await waitFor("#d-sidebar", {
timeout: 5000, timeout: 5000,
}); });
await click(".header-dropdown-toggle.current-user"); await click(".header-dropdown-toggle.current-user");
$(".header-dropdown-toggle.current-user").click(); $(".header-dropdown-toggle.current-user").click();
assert.ok(exists(".quick-access-panel"));
bodyElement.style.width = null; assert.ok(exists(".quick-access-panel"));
}); });
}); });