tyn1998 / test-opensumi-devtools-ci

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

OpenSumi DevTools (foo bar)

A Chrome DevTools Extension for any OpenSumi based IDE.

Web Electron

Features

Currently OpenSumi DevTools focuses on message capturing and presenting:

  • OpenSumi RPC messages
  • Electron IPC messages (working on it...)

Users are allowed to:

  • toggle capturing
  • filter messages
  • viewing parsed messages
  • detect message netspeed
  • detect network latency
  • ...

Install

Before we publish it to chrome webstore, you can install OpenSumi DevTools in your OpenSumi based Web/Electron IDE by steps below:

Web

  1. Download opensumi-devtools-vx.x.x.zip from releases
  2. Unzip it and get a folder
  3. Vist chrome extensions page and check "Developer mode"
  4. Click "Load unpacked extension" and select the folder
  5. Open DevTools in your page and have fun!

Electron

  1. Download opensumi-devtools-vx.x.x.zip from releases
  2. Unzip it and get a folder
  3. In your Electron app's entry point do similar things like below:
import { app, session } from 'electron';
import { ElectronMainApp } from '@opensumi/ide-core-electron-main';

const electronApp = new ElectronMainApp({
  ...
});

electronApp.init().then(() => {
  ...
  const opensumiDevtoolsPath = 'your unpacked folder path';
  session.defaultSession.loadExtension(opensumiDevtoolsPath);
});
  1. Open DevTools in your app and have fun!

Things will get easier after we publish the extension to chrome store. Stay tuned!

Contributing

Please read CONTRIBUTING if you are new here or not familiar with the basic rules of Git/GitHub world.

Quickstart

  1. git clone this repository

  2. cd into this repository

  3. yarn install

  4. yarn run start

  5. Load the freshly built unpacked extension on Chrome following:

    1. Access chrome://extensions/

    2. Check "Developer mode"

    3. Click on "Load unpacked extension"

    4. Select the "build" folder under the project root directory

    5. Keep "service worker" DevTools page open (why?)

  6. Happy hacking!

Others

If you are interested in the early developing phase of this devtools, you can visit this issue and this branch.

About

License:MIT License


Languages

Language:JavaScript 87.0%Language:SCSS 12.2%Language:HTML 0.6%Language:Shell 0.2%