1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 01:39:44 +01:00
metamask-extension/development
Frederik Bolding 086b7dade5
Improve logging at build-time (#18780)
* Improve logging at build-time

* Fix lint
2023-04-25 20:33:36 -10:00
..
build Improve logging at build-time (#18780) 2023-04-25 20:33:36 -10:00
charts Adding artifacts (#15145) 2022-07-20 19:33:16 +04:00
fitness-functions Prevent new JS files in shared folder (#17737) 2023-04-24 15:44:42 +01:00
highlights Nit fixes for story-test integration (#17344) 2023-01-25 09:24:13 +05:30
lib feat: add yaml feature management (#18125) 2023-04-25 16:32:51 +02:00
states feat: add the ConsenSys zkEVM (Linea) as a default network (#17875) 2023-03-21 13:58:38 -02:30
ts-migration-dashboard deps: replace gulp-dart-sass with gulp-sass. (#16302) 2023-04-25 09:37:30 -05:00
announcer.js development scripts: add node shebang; mark as executable (#15655) 2022-08-24 12:25:27 -05:00
chromereload.js Build - refactor background process to use html (#10769) 2021-03-31 11:12:28 +08:00
create-static-server.js development scripts: add node shebang; mark as executable (#15655) 2022-08-24 12:25:27 -05:00
empty.js Build - refactor background process to use html (#10769) 2021-03-31 11:12:28 +08:00
generate-beta-commit.js feat(17494): add generate-beta-commit (#17684) 2023-02-10 20:02:52 +00:00
generate-icon-names.js icon audit, remove xxs icon size (#17089) 2023-01-24 09:39:46 -08:00
generate-lavamoat-policies.js feat: add yaml feature management (#18125) 2023-04-25 16:32:51 +02:00
generate-migration.sh Fixing migration script generation paths (#10664) 2021-03-17 12:21:46 +08:00
get-changed-file-names.sh fix script for linting changed files (#17028) 2023-01-20 09:16:58 -06:00
gource-viz.sh chore: Adjust trailing whitespace (#15636) 2022-08-24 14:11:49 -05:00
jest.config.js split unit tests (#16455) 2023-01-11 12:23:38 -06:00
metamaskbot-build-announce.js feat(17494): beta build trigger in release branch and cleanup (#17749) 2023-03-04 12:51:04 +00:00
missing-locale-strings.js development scripts: add node shebang; mark as executable (#15655) 2022-08-24 12:25:27 -05:00
mock-segment.js development scripts: add node shebang; mark as executable (#15655) 2022-08-24 12:25:27 -05:00
README.md [skip e2e] debug using source maps (#16933) 2022-12-13 14:29:38 +00:00
run-ganache.sh Fix the ganache:start command by making the 'yarn bin' usage compatible with yarn3 (#16983) 2022-12-16 11:43:06 -03:30
sentry-publish.js feat: add yaml feature management (#18125) 2023-04-25 16:32:51 +02:00
sentry-upload-artifacts.sh Automate the Flask release process (#13898) 2022-03-22 19:55:51 -07:00
shellcheck.sh Add lint:shellcheck:package (#7568) 2019-12-11 15:52:08 -05:00
show-deps-install-scripts.js development scripts: add node shebang; mark as executable (#15655) 2022-08-24 12:25:27 -05:00
source-map-explorer.sh Excluding sourcemaps comment in production builds (#10695) 2021-03-22 19:41:23 -07:00
sourcemap-validator.js development scripts: add node shebang; mark as executable (#15655) 2022-08-24 12:25:27 -05:00
static-server.js Remove use of pify from the static-server script (#18239) 2023-03-21 15:07:22 -02:30
stream-flat-map.js Build - refactor for bundle factoring and swappable runtime (#11080) 2021-07-15 10:59:34 -07:00
verify-locale-strings.js [MMI] Adds mmi build type + manifest files and images (#17842) 2023-03-01 09:38:15 +00:00

Development

Several files which are needed for developing on MetaMask.

Usually each file or directory contains information about its scope / usage.

Segment

Debugging with the Mock Segment API

To start the Mock Segment API:

  • Add/replace the SEGMENT_HOST and SEGMENT_WRITE_KEY variables in .metamaskrc
    SEGMENT_HOST='http://localhost:9090'
    SEGMENT_WRITE_KEY='FAKE'
    
  • Build the project to the ./dist/ folder with yarn dist
  • Run the Mock Segment API from the command line
    node development/mock-segment.js
    

Events triggered whilst using the extension will be logged to the console of the Mock Segment API.

More information on the API and its usage can be found here.

Debugging in Segment

To debug in a production Segment environment:

  • Create a free account on Segment
  • Create a New Workspace
  • Add a Source (Node.js)
  • Copy the Write Key from the API Keys section under Settings
  • Add/replace the SEGMENT_HOST and SEGMENT_WRITE_KEY variables in .metamaskrc
    SEGMENT_HOST='https://api.segment.io'
    SEGMENT_WRITE_KEY='COPIED_WRITE_KEY'
    
  • Build the project to the ./dist/ folder with yarn dist

Events triggered whilst using the extension will be displayed in Segment's Debugger.

Debugging Segment requests in MetaMask

To opt in to MetaMetrics;

  • Unlock the extension
  • Open the Account menu
  • Click the Settings menu item
  • Click the Security & Privacy menu item
  • Toggle the Participate in MetaMetrics menu option to the ON position

You can inspect the requests in the Network tab of your browser's Developer Tools (background.html) by filtering for POST requests to /v1/batch. The full url will be http://localhost:9090/v1/batch or https://api.segment.io/v1/batch respectively.

Sentry

Debugging in Sentry

To debug in a production Sentry environment:

  • If you have not already got a Sentry account, you can create a free account on Sentry
  • Create a New Sentry Organization
    • If you already have an existing Sentry account and workspace, open the sidebar drop down menu, then click Switch organization followed by Create a new organization
  • Create a New Project
  • Copy the Public Key and Project ID from the Client Keys section under your projects Settings
    • Select Settings in the sidebar menu, then select Projects in the secondary menu. Click your project then select Client Keys (DSN) from the secondary menu. Click the Configure button on the Client Keys page and copy your Project Id and Public Key
  • Add/replace the SENTRY_DSN and SENTRY_DSN_DEV variables in .metamaskrc
    SENTRY_DSN_DEV=https://{SENTRY_PUBLIC_KEY}@sentry.io/{SENTRY_PROJECT_ID}
    SENTRY_DSN=https://{SENTRY_PUBLIC_KEY}@sentry.io/{SENTRY_PROJECT_ID}
    
  • Build the project to the ./dist/ folder with yarn dist

Errors reported whilst using the extension will be displayed in Sentry's Issues page.

Source Maps

Debugging production builds using Source Maps

To unbundle the extensions compiled and minified JavaScript using Source Maps:

  • Open Chrome DevTools to inspect the background.html or home.html view
  • Click on the Sources tab in Chrome DevTools
  • In the Sources tab, click on the Page panel
  • Expand the file directory in the Page panel until you see the source files you're after
  • Select a source file in the Page panel
chrome-extension://{EXTENSION_ID}/common-0.js
  • Double click the source file to open it in the Workspace
  • Right click in the body of the source file and select Add source map...
  • Enter the path to the corresponding source map file, and Click Add
file:///{LOCAL_FILE_SYSTEM}/metamask-extension/dist/sourcemaps/common-0.js.map
  • Repeat the steps above as necessary adding all the relevant source map files
  • Your source maps should now be added to the DevTools Console, and you should be able to see your original source files when you debug your code