1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-22 17:33:23 +01:00
metamask-extension/development
Elliot Winkler a7d98b695f
Add TypeScript migration dashboard (#13820)
As we convert parts of the codebase to TypeScript, we will want a way to
track progress. This commit adds a dashboard which displays all of the
files that we wish to convert to TypeScript and which files we've
already converted.

The list of all possible files to convert is predetermined by walking
the dependency graph of each entrypoint the build system uses to compile
the extension (the files that the entrypoint imports, the files that the
imports import, etc). The list should not need to be regenerated, but
you can do it by running:

    yarn ts-migration:enumerate

The dashboard is implemented as a separate React app. The CircleCI
configuration has been updated so that when a new commit is pushed, the
React app is built and stored in the CircleCI artifacts. When a PR is
merged, the built files will be pushed to a separate repo whose sole
purpose is to serve the dashboard via GitHub Pages (this is the same
way that the Storybook works). All of the app code and script to build
the app are self-contained under
`development/ts-migration-dashboard`. To build this app yourself, you
can run:

    yarn ts-migration:dashboard:build

or if you want to build automatically as you change files, run:

    yarn ts-migration:dashboard:watch

Then open the following file in your browser (there is no server
component):

    development/ts-migration-dashboard/build/index.html

Finally, although you shouldn't have to do this, to manually deploy the
dashboard once built, you can run:

    git remote add ts-migration-dashboard git@github.com:MetaMask/metamask-extension-ts-migration-dashboard.git
    yarn ts-migration:dashboard:deploy
2022-08-09 14:16:08 -06:00
..
build Fix build script errors (#15493) 2022-08-06 03:33:35 -04:00
charts Adding artifacts (#15145) 2022-07-20 19:33:16 +04:00
highlights Remove unnecessary file extensions (#15352) 2022-07-27 14:32:17 -05:00
lib remove exclusions for mismatched object jsdoc type casing (#15351) 2022-07-27 08:28:05 -05:00
states Support for GridPlus Lattice1 hardware wallet (#12053) 2021-11-08 11:18:41 -03:30
ts-migration-dashboard Add TypeScript migration dashboard (#13820) 2022-08-09 14:16:08 -06:00
announcer.js Migrate version from _base manifest to package.json (#11029) 2021-05-10 14:16:03 -07:00
chromereload.js Build - refactor background process to use html (#10769) 2021-03-31 11:12:28 +08:00
create-static-server.js @metamask/eslint config@5.0.0 (#10358) 2021-02-04 10:15:23 -08:00
empty.js Build - refactor background process to use html (#10769) 2021-03-31 11:12:28 +08:00
generate-lavamoat-policies.sh Adding option to update lavamoat policies in parallel (#14536) 2022-08-09 11:08:34 -05:00
generate-migration.sh Fixing migration script generation paths (#10664) 2021-03-17 12:21:46 +08:00
gource-viz.sh dev - move gource instructions from docs to development script 2019-09-10 22:05:16 +08:00
jest.config.js Jest tests - incremental coverage (#14612) 2022-05-04 17:02:42 +01:00
metamaskbot-build-announce.js Add TypeScript migration dashboard (#13820) 2022-08-09 14:16:08 -06:00
missing-locale-strings.js @metamask/eslint config@5.0.0 (#10358) 2021-02-04 10:15:23 -08:00
mock-3box.js @metamask/eslint config@5.0.0 (#10358) 2021-02-04 10:15:23 -08:00
mock-segment.js Remove unused SEGMENT_LEGACY_WRITE_KEY (#12429) 2021-10-22 10:34:37 -02:30
README.md Sentry documentation (#14788) 2022-06-15 21:48:40 +01:00
run-ganache.sh Adding support for EIP-1559 in E2E tests (#13282) 2022-01-19 04:38:41 +05:30
sentry-publish.js Automate the Flask release process (#13898) 2022-03-22 19:55:51 -07: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 @metamask/eslint config@5.0.0 (#10358) 2021-02-04 10:15:23 -08:00
source-map-explorer.sh Excluding sourcemaps comment in production builds (#10695) 2021-03-22 19:41:23 -07:00
sourcemap-validator.js Use externally hosted phishing warning page 2022-05-16 14:40:50 -02:30
static-server.js @metamask/eslint config@5.0.0 (#10358) 2021-02-04 10:15:23 -08:00
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 update prettier (#15360) 2022-07-31 13:26:40 -05: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.