#5016 Add instructions on how to install development build to Chrome and Firefox (#5034)

* updated readme

* fix: pr reviews

Author: Ioan Moldovan

README.md

@@ -10,41 +10,35 @@ Mock tests: ![Mock tests](https://flowcrypt.semaphoreci.com/badges/flowcrypt-bro
 
 Live tests: [![Live Tests](https://semaphoreci.com/api/v1/flowcrypt/flowcrypt-browser/branches/master/badge.svg)](https://semaphoreci.com/flowcrypt/flowcrypt-browser)
 
-This project is written in TypeScript. Browsers only understand JavaScript, so the project needs to be transpiled. You need to build the project the first time you download it, and build it after each change you make to see the result in the browser. First, install tooling:
+This project is written in TypeScript. Browsers only understand JavaScript, so the project needs to be transpiled. You need to build the project the first time you download it, and build it after each change you make to see the result in the browser. To get started, please follow the instructions below:
 
+1. Install the tooling by running the following command after navigating to the appropriate folder:
 ```bash
 $ cd some/folder/flowcrypt-browser
 $ npm install
 ```
+2. To build the project (currently available for Linux and Mac only), run the following command:
 
-To build the project (for now Linux and Mac only)
-
-```
-$ npm run-script build
-
-> [email protected] build /home/luke/git/flowcrypt-browser
-> gulp
-
-[02:42:04] Using gulpfile ~/git/flowcrypt-browser/gulpfile.js
-[02:42:04] Starting 'default'...
-[02:42:04] Starting 'flush'...
-[02:42:04] Finished 'flush' after 62 ms
-[02:42:04] Starting 'transpileProjectTs'...
-[02:42:04] Starting 'copySourceFiles'...
-[02:42:04] Starting 'copyVersionedManifest'...
-[02:42:05] Finished 'copyVersionedManifest' after 199 ms
-[02:42:05] Finished 'copySourceFiles' after 557 ms
-[02:42:12] Finished 'transpileProjectTs' after 7.57 s
-[02:42:12] Starting 'chromeBuildSpacesToTabs'...
-[02:42:12] Finished 'chromeBuildSpacesToTabs' after 4.55 ms
-[02:42:12] Starting 'copyChromeToFirefox'...
-[02:42:12] Finished 'copyChromeToFirefox' after 323 ms
-[02:42:12] Starting 'copyChromeToFirefoxEditedManifest'...
-[02:42:12] Finished 'copyChromeToFirefoxEditedManifest' after 10 ms
-[02:42:12] Finished 'default' after 7.97 s
+```bash
+$ npm run build
 ```
+After running this command, you can find your built project in the `build/chrome-consumer` and `build/firefox-consumer` folders.
+
+To load the extension in Google Chrome, please follow these steps:
+
+1. Open your Chrome browser and navigate to `chrome://extensions/`.
+2. If not already enabled, toggle on the `Developer mode`    switch located at the top-right corner.
+3. Click on the `Load Unpacked` button.
+4. Browse to and select the appropriate folder, either `build/chrome-consumer` or `chrome-enterprise`.
+
+Similarly, to load the extension in Firefox, follow these steps:
+
+1. Open your Firefox browser and navigate to `about:debugging`.
+2. Click on the `This Firefox` tab.
+3. Click on the `Load Temporary Add-on` button located at the top-right corner.
+4. Browse to and select the appropriate folder, either `build/firefox-consumer` or `firefox-enterprise`, and select the `manifest.json` file.
 
-Now you can find your built project in `build/chrome-consumer` and `build/firefox-consumer`
+If you prefer, you can also use the `run_firefox` script (`npm run run_firefox`) included in the package.json file to run the Firefox extension in a separate instance without interfering with the production extension installed in your browser.
 
 Printing debug data to test logs can be done using special `Debug` class:
 https://github.com/FlowCrypt/flowcrypt-browser/tree/master/extension/js/common/platform/debug.ts#L7