A plugin to block the Darkreader extension from working on your already dark website!
npm install no-darkreader
Installation •
Usage •
Contributing •
FAQ •
License
You could copy the latest minified version from nodarkreader.min.js, also it's available via npm:
``sh`
npm install no-darkreader
You only need to setup your index.html file as shown bellow, then it should work properly:
`html`
...
...
...
...
...
Or if it was installed via npm, you could add this metatag to your index.html:
`html`
also don't forget to import the plugin within your app's entrypoint (e.g. index.js or App.js ):
`js`
import 'no-darkreader'
> note: please run ./minify.sh before submitting any PR!
Pull requests are welcome! For larger changes, especially structural ones, please open an issue first to discuss what you would like to change.
If you have a feature request, feel free to open an issue!
ts
function isAnotherDarkReaderInstanceActive() {
const meta: HTMLMetaElement = document.querySelector('meta[name="darkreader"]');
if (meta) {
if (meta.content !== INSTANCE_ID) {
return true;
}
return false;
}
createDarkReaderInstanceMarker();
return false;
}
`
no-darkreader tricks this function by injecting a fake metatag named darkreader which prevents DarkReader from wokring, also it inverse every css/html modification DarkReader does.$3
You may encounter this infinite-loop which causes a performance issue:1-
DarkReader injects a metatag with its instance ID (DarkReader may work before no-darkreader plugin):
`ts
// SOURCE: https://github.com/darkreader/darkreader/blob/a08d923f43aaf8b96293491fe0c649c9e0c1edc2/src/inject/dynamic-theme/index.ts
function createDarkReaderInstanceMarker() {
const metaElement: HTMLMetaElement = document.createElement('meta');
metaElement.name = 'darkreader';
metaElement.content = INSTANCE_ID;
document.head.appendChild(metaElement);
}
function isAnotherDarkReaderInstanceActive() {
const meta: HTMLMetaElement = document.querySelector('meta[name="darkreader"]');
if (meta) {
if (meta.content !== INSTANCE_ID) {
return true;
}
return false;
}
createDarkReaderInstanceMarker(); // added if there's no metatag named darkreader.
return false;
}
`2-
no-darkreader removes DarkReader metatag in order to inject a fake one.3-
DarkReader reinjects a metatag before no-darkreader` injecting a fake one.4- goto step 2.
This project is licensed under an MIT license.