I have created a small imperative vanilla JavaScript script to block distracting news websites I feel an addiction-like behavior to:
// ==UserScript==
// @name blocksite
// @match *://*.news_site_1.com/*
// @match *://*.news_site_2.com/*
// ==/UserScript==
function blocksite () {
document.body.innerHTML =`<div dir="ltr"; style="font-size:100px; font-weight: bold; text-align: center">Blocked !</div>`;
}
setTimeout( blocksite(), 1000)
setTimeout( blocksite(), 5000) // Block possible later DOM mutations;
setTimeout( blocksite(), 10000) // Block possible later DOM mutations;
The script basically works (a popup takes over the DOM), but my problem is that it only blocks sites after all their DOM content was both parsed and rendered, while I am interested to block parsing generally.
While listening to load event is too late, listening to the earlier DOMContentLoaded event can have a better result than either listening to load or listening to setTimeout(), as blocking could occur right after content is parsed, instead of rendered.
Yet, I need a way to totally prevent the parsing of any webpage of the relevant websites (or alternatively, blocking any further parsing after the very first DOM HTML element node was parsed).
Per comments, I tried in Google Chrome:
window.stop(); I don't recall any significant change
window.close(); It worked for me only from devtool console
window.location.replace("about:blank"); It worked for me only after load event finished instead when parsing starts
Does the operation I need even possible with the latest ECMAScript (10) and if so, what command should be used?
Dear Sxribe, I have created the following file with the following code.
The file does get loaded by Tampermonkey (With a proper @match list) but I saw no change in browser when loading matched websites (these websites aren't blocked and get loaded normally).
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
window.open("C:\Users\MY_USER_NAME\Desktop\blocksite.html");
Old, wrong answer here: https://hastebin.com/vujuduforu.txt
Alright, so, chrome/firefox do not like having local files being opened with window.close(). In the end, I ended up simply hosting the website on glitch.com (free 100%), then redirecting to it. Here is my code for everything:
Tampermonkey Script:
// ==UserScript==
// @name blocktest
// @namespace http://tampermonkey.net/
// @version 0.1
// @description try to take over the world!
// @author You
// @match *://*.bing.com/*
// ==/UserScript==
(function() {
'use strict';
window.open("https://block-sxribe.glitch.me/", "_self");
})();
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>This site has been blocked.</title>
<link rel="stylesheet" href="./index.css">
</head>
<body>
<div class="flex-container">
<div class="content">
<h1>This site has been blocked.</h1>
<p id="sep"></p>
<p>This site was blocked with Tampermonkey.</p>
</div>
</div>
</body>
</html>
CSS:
@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');
* {
margin: 0;
padding: 0;
font-family: 'Open Sans', sans-serif;
text-transform: uppercase;
}
.flex-container {
width: 100vw;
height: 100vh;
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
}
#sep {
margin-left: 20vw;
width: 60vw;
border-bottom: 1px solid lightgray;
}
tl;dr Host website online, run window.open("website location.com", "_self") to open the website in current window.