Skip to content

fix: scope logo palette inline script to avoid global collisions #4542

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
selul merged 1 commit into from
Jul 21, 2026
+62 −6
Merged

fix: scope logo palette inline script to avoid global collisions #4542

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 9 additions & 6 deletions header-footer-grid/Core/Components/Logo.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -248,8 +248,9 @@ public function toggle_script() {
$variants_json = wp_json_encode( $variants );

$script = <<<JS
var html = document.documentElement;
var theme = html.getAttribute('data-neve-theme') || 'light';
;(function () {
var htmlEl = document.documentElement;
var theme = htmlEl.getAttribute('data-neve-theme') || 'light';
var variants = {$variants_json};

function setCurrentTheme( theme ) {
Expand Down Expand Up @@ -283,16 +284,18 @@ function setCurrentTheme( theme ) {

var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if (mutation.type == 'attributes') {
theme = html.getAttribute('data-neve-theme');
if (mutation.type == 'attributes' && mutation.attributeName === 'data-neve-theme') {
theme = htmlEl.getAttribute('data-neve-theme');
setCurrentTheme(theme);
};
});
});

observer.observe(html, {
attributes: true
observer.observe(htmlEl, {
attributes: true,
attributeFilter: ['data-neve-theme']
});
})();
JS;
return $script;
}
Expand Down
53 changes: 53 additions & 0 deletions tests/js/logo-toggle-script.test.mjs
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
// Behavioral test for the Logo palette inline script (issue #4541).
// Run: node tests/js/logo-toggle-script.test.mjs
import { readFileSync } from 'fs';
import { strict as assert } from 'assert';
import { JSDOM, VirtualConsole } from 'jsdom';

const php = readFileSync(new URL('../../header-footer-grid/Core/Components/Logo.php', import.meta.url), 'utf8');
const js = php.match(/<<<JS\n([\s\S]*?)\nJS;/)[1].replace(
'{$variants_json}',
JSON.stringify({ logo: { same: false, light: { src: 'http://x/light.png', srcset: '', sizes: '' }, dark: { src: 'http://x/dark.png', srcset: '', sizes: '' } } })
);

function makePage() {
const errors = [];
const virtualConsole = new VirtualConsole();
virtualConsole.on('jsdomError', (e) => errors.push(e));
const dom = new JSDOM(
'<html><body><img class="neve-site-logo" data-variant="logo" src="http://x/light.png"></body></html>',
{ runScripts: 'outside-only', virtualConsole }
);
dom.window.eval(js);
return { window: dom.window, errors };
}

const tick = () => new Promise((r) => setTimeout(r, 0));

// 1. No page globals leaked.
{
const { window } = makePage();
assert.equal(window.html, undefined, 'script leaks global "html"');
assert.equal(window.setCurrentTheme, undefined, 'script leaks global "setCurrentTheme"');
}

// 2. Survives a clobbered window.html + unrelated root attribute change.
{
const { window, errors } = makePage();
window.html = 'not-an-element';
window.document.documentElement.setAttribute('data-test', '1');
await tick();
assert.deepEqual(errors, [], `observer threw: ${errors[0]}`);
}

// 3. Still swaps the logo on data-neve-theme change (even after the clobber).
{
const { window, errors } = makePage();
window.html = 'not-an-element';
window.document.documentElement.setAttribute('data-neve-theme', 'dark');
await tick();
assert.deepEqual(errors, [], `observer threw: ${errors[0]}`);
assert.equal(window.document.querySelector('.neve-site-logo').src, 'http://x/dark.png', 'logo did not swap to dark variant');
}

console.log('logo-toggle-script: all assertions passed');
Loading