Web Mask

It overrides resources, JS, CSS, Image, and fonts, of a website with the copies from a local web server.

¿Qué es Web Mask?

Web Mask es una extensión de Chrome desarrollada por Frank Ren, y su función principal es "It overrides resources, JS, CSS, Image, and fonts, of a website with the copies from a local web server.".

Capturas de Pantalla de la Extensión

screenshot
screenshot
screenshot
screenshot

Descargar Archivo CRX de la Extensión Web Mask

Descarga archivos de extensión Web Mask en formato crx, instala manualmente las extensiones de Chrome en el navegador o comparte los archivos crx con amigos para instalar fácilmente las extensiones de Chrome.

Instrucciones de Uso de la Extensión

                        It enables you to

- Debug a remote web site, for which source map is usually disabled, with your local web server
- Test your local changes with actual data from remote servers - integration test before pull request

The idea and its implementation are based on HTTP and HTML web standards, independent to the framework of your choice, with the following constraints:
* It doesn't work with `document.write()`
* The local web server must include HTTP response header, Access-Control-Allow-Origin:*
* "Bypass for network" for service workers. See screenshots for instruction.

It's similar to "Resource Override", but it requires a minimum configuration, it is built for Manifest V3, and it is test automation friendly. See
* https://chrome.google.com/webstore/detail/resource-override/pkoacgokdfckfpndoffpifphamojphii
* https://developer.chrome.com/docs/extensions/mv3/mv2-sunset/

Tests (in alphabetic order)
* Successful. Manual.
  * Target website: https://angular.io/
  * Source code: https://github.com/angular/angular
* Successful. Automated.
  * Target website: https://material.angular.io/
  * Source code: https://github.com/angular/material.angular.io
* Not supported. The local web server doesn't include the HTTP response header, Access-Control-Allow-Origin:*
  * Target website: https://reactjs.org/
  * Source code: https://github.com/reactjs/reactjs.org
* Successful. Automated.
  * Target website: https://vuejs.org/
  * Source code: https://github.com/vuejs/docs                    

Información Básica de la Extensión

Nombre Web Mask Web Mask
ID cnglippokopaohjfeejlkblfjnekojia
URL Oficial https://chromewebstore.google.com/detail/web-mask/cnglippokopaohjfeejlkblfjnekojia
Descripción It overrides resources, JS, CSS, Image, and fonts, of a website with the copies from a local web server.
Tamaño del Archivo 28.1 KB
Cantidad de Instalaciones 45
Versión Actual 2.1
Última Actualización 2023-05-25
Fecha de Publicación 2022-09-07
Calificación 5.00/5 Total de 1 Calificaciones
Desarrollador Frank Ren
Correo electrónico [email protected]
Tipo de Pago free
Sitio Web de la Extensión https://github.com/renfeng/web-mask
URL de la Página de Ayuda https://github.com/renfeng/web-mask
Idiomas Soportados en-GB
manifest.json
{
    "update_url": "https:\/\/clients2.google.com\/service\/update2\/crx",
    "manifest_version": 3,
    "name": "Web Mask",
    "description": "It overrides resources, JS, CSS, Image, and fonts, of a website with the copies from a local web server.",
    "version": "2.1",
    "icons": {
        "16": "icon16.png",
        "48": "icon48.png",
        "128": "icon128.png"
    },
    "action": {
        "default_popup": "popup.html"
    },
    "background": {
        "service_worker": "background.js"
    },
    "content_scripts": [
        {
            "matches": [
                "*:\/\/*\/*"
            ],
            "js": [
                "content.js"
            ],
            "all_frames": true
        }
    ],
    "web_accessible_resources": [
        {
            "matches": [
                "*:\/\/*\/*"
            ],
            "resources": [
                "page.js"
            ]
        }
    ],
    "permissions": [
        "declarativeNetRequestWithHostAccess",
        "webRequest"
    ],
    "host_permissions": [
        "*:\/\/*\/*"
    ]
}