Расширения для chromium это просто
Создадим маленькое расширение для chromium браузеров (яндекс браузер, гугл хром, и тд).
Немного волшебства, расширение позволит управлять технологией canvas и webgl.
Создаём папку для расширения, открываем её, и создаём там 3 файла.
manifest.json
{"description": "", "manifest_version": 3, "name": "magic html5 :)", "version": "1.0", "web_accessible_resources": [{"resources": ["app.js"], "matches": ["http://*/*","https://*/*"]}], "content_scripts": [{"all_frames": true, "matches": ["http://*/*","https://*/*"], "css": [], "js": ["s.js"]}]}
s.js
var s = document.createElement('script');
s.src = chrome.runtime.getURL('app.js');
(document.head || document.documentElement).appendChild(s);
app.js
HTMLCanvasElement.prototype.getContext = function(type){};
Этот простой код разрешит играть только в html игры, а технологии как canvas и webgl (не существует), чуть ниже улучшим код.
Теперь открываем новую вкладку, переходим сюда chrome://extensions
Справа вверху включаем Режим разработчика, нам понадобится кнопка слева Загрузить распакованное расширение, тык, и осталось выбрать папку с расширением, после этого расширение уже будет установлено и активно!
Расширения как создаются легко, так и отключаются / удаляются.
Попробуйте открыть любую html5 игру, некоторые игры могут показать ошибку, либо просто пустота будет, не предсказать и не угадать.
Теперь улучшим код, допустим захотели оставить только canvas (2d контекст) а webgl пусть отдыхает, если игра рассчитана на все устройства - она будет работать!
Откройте файл app.js, удалите ту строчку, новый код такой
var _getContext = HTMLCanvasElement.prototype.getContext;
HTMLCanvasElement.prototype.getContext = function(type){
if(type != '2d')return null;
return _getContext.apply(this, arguments);
};
Сохраните файл, изменения сразу применятся (если нет ошибок в коде js)
Что мы сделали?
Сначала сохранили ссылку на оригинальную функцию getContext, и потом переопределили её, дальше проверяем какой контекст запрашивает игра, если не 2d значит вернём null, а иначе вызываем оригинальную функцию.
Теперь будут работать только canvas игры (2d контекст) но про webgl 1-2 мы ничего не знаем, нет такой технологии)
Если игра открылась, отлично, а у нас открылись новые возможности, у 2d есть функция drawImage, fillText, всё это тоже можно переопределить, и увидеть игру без текста, или без графики, при этом не нужно даже код движка игры менять.
Самое интересное это drawImage, ведь туда передаётся объект Image, который имеет много чего, эта функция не даст заскучать)
Отключение отрисовки текста:
CanvasRenderingContext2D.prototype.fillText = function(){};
CanvasRenderingContext2D.prototype.strokeText = function(){};
Обработка отрисовки изображений:
var _drawImage = CanvasRenderingContext2D.prototype.drawImage;
CanvasRenderingContext2D.prototype.drawImage = function(image, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight){
_drawImage.apply(this, arguments);
};
А теперь захотелось отключить только webgl2 (чтобы потестить), может ли игра работать с webgl1, на мобильных устройствах с webgl2 всё хорошо, а вот на пк не очень...
Заменяем строчку
if(type != '2d')return null;
на
if(type == 'webgl2')return null;
Теперь будет поддерживаться всё кроме webgl2, игра должна обязательно открыться и работать, а не надеяться на webgl2 который может быть занесён в чёрный список браузера!
Вот примерно так можно переопределять всё остальное, строить логику нужную.
Нужно вернуть как было? Можно удалить весь код, или отключить расширение.
Хотел ещё добавить код с волшебством для аудио и видео, но странная реакция на обычный текст, превращается в ссылки непонятные.
Обновил пост, добавил примеры: отключение отрисовки текста, и обработка отрисовки изображений.
