chrome 72 изменяет поведение карты исходного кода - PullRequest
0 голосов
/ 13 февраля 2019

Я разрабатываю Webextension for Chrome, код написан на Typescript, поэтому мне нужны исходные карты.

Расширение поставляется в комплекте с ParcelJS, но я считаю, что моя проблема не связана с компоновщиком.

После обновления с Chrome 70 до 72 исходные карты больше не работают.В качестве минимального примера я могу воспроизвести проблему на MacOS 14 и Ubuntu 18.04, Chrome 72 со следующим кодом.

Эта проблема, кажется, изолирована от Chrome 72. К сожалению, на момент написания этойтекущая стабильная версия:

  • версия 73.0.3683.27 (официальная сборка) бета-версия (64-разрядная), без проблем
  • версия 71.0.3578.98 (официальная сборка) стабильная Chromium 64-разрядная,без проблем
  • Версия 72.0.3626.96 (Официальная сборка) (64-разрядная версия), не работает

Для удобства я настроил репозиторий github.Клонируйте его и выполните следующие команды (извините, я не уверен, нужно ли вам устанавливать пакет посылок глобально. Я всегда делаю это для удобства)

git clone https://github.com/lhk/contentscript_smap.git
cd contentscript_smap
# npm install -g parcel-bundler 
npm install -d
parcel build manifest.json

Чтобы следовать правилам Stackoverflow (если вы связываетедля кодирования, вы также должны включить его в свой вопрос, ссылка может перейти в какой-то момент):

content.ts:

console.log('log from typescript')

manifest.json:

{
    "manifest_version": 2,
    "name": "sourcemaps messed up",
    "version": "0.0.1",
    "description": "",
    "author": "",
    "content_scripts": [
        {
            "matches": [
                "<all_urls>"
            ],
            "js": [
                "./content.ts"
            ]
        }
    ],
    "permissions": [
        "activeTab",
        "<all_urls>"
    ]
}

package.json:

{
  "name": "contentscript_smap",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/lhk/contentscript_smap.git"
  },
  "author": "",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/lhk/contentscript_smap/issues"
  },
  "homepage": "https://github.com/lhk/contentscript_smap#readme",
  "dependencies": {
    "parcel-bundler": "^1.11.0",
    "parcel-plugin-web-extension": "^1.5.1",
    "typescript": "^3.3.3"
  }
}

Parcel объединит расширение и создаст папку dist/, оттудаВы можете установить его в Firefox и Chrome.

Firefox прекрасно работает (посмотрите ссылку на исходный код контента .TS ):

firefox ts sourcemap

Chrome не находит исходную карту:

enter image description here

И консоль просто отображает скомпилированный источник вместоисходный сопоставленный первоисточник.Я вообще не могу найти машинописный код в Chrome.

Ответы [ 2 ]

0 голосов
/ 19 февраля 2019

Для меня вот что решило проблему.

  1. Изменение devtool : "source-map" -> "eval-source-map" в конфигурации веб-пакета с mode : "development".

  2. Добавить "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'" в manifest.json

Боюсь, у меня недостаточно времени, чтобы разобраться, как это решило проблему.Возможно, я обновлю ответ позже с правильной аргументацией.

0 голосов
/ 18 февраля 2019

Firefox имеет похожую проблему: исходные карты не могут быть загружены во всплывающих и фоновых скриптах.Это даже упоминается в документах , обходной путь заключается в размещении ваших исходных карт на локальном веб-сервере.

Поэтому я поэкспериментировал с этим и обнаружил, что это устраняет мою проблему с Chrome.Надеемся, что вы можете воспроизвести его, выполнив следующие действия:

  • установить локальный https-сервер, такой как local-web-server : npm install local-web-server
  • настроитьСистема доверяет сертификату этого сервера: https://github.com/lwsjs/local-web-server/wiki/How-to-get-the-%22green-padlock%22-using-the-built-in-certificate
  • отредактируйте манифест расширений для доверия серверу localhost: "content_security_policy": "script-src 'self' https://127.0.0.1:8000/; object-src 'self'"
  • установите пути в вашем расширении на локальный хост, вы можетесделайте это с помощью parcel: parcel build src/manifest.json --public-url=https://127.0.0.1:8000/
  • cd dist/ и ws -https для настройки локального сервера

Теперь перезагрузите расширение в Chrome, и оно работает (ну, по крайней мере,для меня).

...