chore: Introduce Yarn as our package manager (#647)

* move stuff to yarn

* change build.yaml

* change build to work better

* change name of installation task

* change more stuff from npm to yarn

* make some more simple changes

* run npm upgrade

* remove unncessary changes

* update yarn.lock

* try -frozen-lockfile param

* testing with a minor change to trigger build again

* update readme

* fix formatting

* update documentation

* remove package-lock from prettierignore since the file doesn't exist anymore

* change version and other pr comments

* change occurance of npm

* change workflow.md

* update setup file

* update setting up vscode document

.prettierignore

@@ -6,7 +6,7 @@ test-results/
 .DS_Store
 copyright-header.txt
 LICENSE
-package-lock.json
+yarn.lock
 .prettierignore
 docs/NOTICE.html
 docs/LICENSE.txt

Gruntfile.js

@@ -171,7 +171,7 @@ module.exports = function(grunt) {
                 files: ['src/**/*.scss'],
                 tasks: ['sass', 'copy:styles', 'embed-styles:code', 'drop:dev'],
             },
-            // We assume webpack --watch is running separately (usually via 'npm run watch')
+            // We assume webpack --watch is running separately (usually via 'yarn watch')
             'webpack-output': {
                 files: ['extension/devBundle/**/*.*'],
                 tasks: ['embed-styles:code', 'drop:dev'],

README.md

@@ -28,7 +28,9 @@ You can install the extension from one of the following links
 Please ensure that you have at least the **minimum** recommended versions
 
 -   Node - 10.15.0 (Check by running `node --version`) - This is the version being enforced on our builds
--   NPM - 6.4.1 (Check by running `npm --version`)
+-   Yarn - Version >= v1.15.2 (Check by running `yarn --version`)
+
+> In case you dont have yarn, please install from: [Yarn](https://yarnpkg.com/en/)
 
 #### 1. Clone the repository
 
@@ -48,20 +50,21 @@ Please ensure that you have at least the **minimum** recommended versions
 #### 2. Install packages
 
 -   Install the packages
+
     ```bash
-    npm install
+    yarn install
     ```
 
 #### 3. Build and run unit tests
 
 -   Run the unit tests
     ```bash
-    npm test
+    yarn test
     ```
 -   Build and run the end-to-end tests (note: you must use a **non**-admin prompt to avoid [this issue](https://stackoverflow.com/questions/36835130))
     ```bash
-    npm run build
-    npm run test:e2e
+    yarn build
+    yarn test:e2e
     ```
     There are more details in the Testing section below.
 
@@ -69,7 +72,7 @@ Please ensure that you have at least the **minimum** recommended versions
 
 -   Build the (unpacked) extension
     ```bash
-    npm run build
+    yarn build
     ```
 -   Add the extension to your browser
 
@@ -88,11 +91,11 @@ Please ensure that you have at least the **minimum** recommended versions
 
 -   Run the below command to build, test, check if files have copyright header, check file format styling & tslint issues
     ```bash
-    npm run precheckin
+    yarn precheckin
     ```
 -   If the above command failed for formatting issues, run the below command to format all files
     ```bash
-    npm run format
+    yarn format
     ```
 
 ### More Information
@@ -107,9 +110,9 @@ We use [jest](https://github.com/facebook/jest) as our test framework and [puppe
 
 To run a task from the command palette, press **Ctrl + Shift + P**, select `Tasks: Run Task`, and select the task you want to run:
 
--   `npm: test` runs all unit tests
+-   `yarn test` runs all unit tests
 -   `Test current file in VSCode` runs just the tests in the currently-opened test file
--   `npm: test:e2e` runs all end-to-end tests
+-   `yarn test:e2e` runs all end-to-end tests
 
 To debug a test inside VS Code, set a breakpoint and click the debug button or press **F5**.
 
@@ -121,15 +124,15 @@ You can start an interactive watch session that automatically runs tests affecte
 
 #### Using the terminal
 
-`npm test` runs all unit tests.
-`npm test -- -u` runs all unit tests and updates snapshot files.
+`yarn test` runs all unit tests.
+`yarn test -- -u` runs all unit tests and updates snapshot files.
 
-`npm run test:e2e` runs all end-to-end tests - you'll need to run `npm run build` first if you've changed non-test code.
-`npm run test:e2e -- -u` runs all end-to-end tests and updates snapshot files.
+`yarn test:e2e` runs all end-to-end tests - you'll need to run `yarn build` first if you've changed non-test code.
+`yarn test:e2e -- -u` runs all end-to-end tests and updates snapshot files.
 
-To run a single or small number of test files, run `npm test -- {FILE_NAME_REGEX}`
+To run a single or small number of test files, run `yarn test -- {FILE_NAME_REGEX}`
 
-Options after the `--` are passed to Jest. For example, `npm test -- --watch` will start an interactive watch session. See more about Jest options [here](https://jestjs.io/docs/en/cli.html).
+Options after the `--` are passed to Jest. For example, `yarn test -- --watch` will start an interactive watch session. See more about Jest options [here](https://jestjs.io/docs/en/cli.html).
 
 To debug using an external tool, run `node --inspect-brk ./node_modules/jest/bin/jest.js --runInBand {RELATIVE_FILE_PATH}`. In Chrome, for example, navigate to `chrome://inspect` and click `Open dedicated DevTools for Node`.
 

build.yaml

@@ -9,28 +9,16 @@ jobs:
       steps:
           - template: pipeline/prerequisites.yaml
 
-          - task: Npm@1
-            inputs:
-                command: custom
-                customCommand: run tslint
-            displayName: npm run tslint
+          - script: yarn tslint
+            displayName: check lint errors
 
-          - task: Npm@1
-            inputs:
-                command: custom
-                customCommand: run format-check
-            displayName: check code formatting
+          - script: yarn format-check
+            displayName: check formatting errors
 
-          - task: Npm@1
-            displayName: check copyright headers
-            inputs:
-                command: custom
-                customCommand: run copyrightheaders
+          - script: yarn copyrightheaders
+            displayName: check copyrightheaders
 
-          - task: Npm@1
-            inputs:
-                command: custom
-                customCommand: run test -- --ci
+          - script: yarn test --ci
             displayName: run unit tests
 
           - task: PublishTestResults@2

docs/setup-tslint-on-vs-code.md

@@ -3,11 +3,6 @@ Copyright (c) Microsoft Corporation. All rights reserved.
 Licensed under the MIT License.
 -->
 
-1. Make sure you have `typescript` and `tslint` npm packages installed:
-    1. Install typescript
-       `npm install -g typescript`
-    2. Install tslint
-       `npm install -g tslint`
-2. On VSCode, go to EXTENSIONS (`Ctrl + Shift + X`)
-3. Search tslint extension and install it
-4. You may need to reopen VSCode for the changes to take effect
+1. On VSCode, go to EXTENSIONS (`Ctrl + Shift + X`)
+2. Search tslint extension and install it
+3. You may need to reopen VSCode for the changes to take effect

docs/workflow.md

@@ -5,10 +5,10 @@ Licensed under the MIT License.
 
 # Developer Workflow
 
-## Automatically Build (`npm run watch`)
+## Automatically Build (`yarn watch`)
 
 You can initiate a process to automatically build the extension on any source code changes and be able to see the changes in the browser. To start this run
 
-    `npm run watch`
+    `yarn watch`
 
 Any time a non-test source file is changed, the build will automatically run.

package.json

@@ -9,7 +9,7 @@
     },
     "engines": {
         "node": ">=10.15.0",
-        "npm": ">=6.4.1"
+        "yarn": "^1.15.2"
     },
     "scripts": {
         "build": "grunt",

pipeline/e2e-test.yaml

@@ -2,14 +2,8 @@
 # Licensed under the MIT License.
 steps:
     # e2e tests depend drop folder. run build:all will create said folder
-    - task: Npm@1
-      inputs:
-          command: custom
-          customCommand: run build:all
-      displayName: npm run build:all
+    - script: yarn build:all
+      displayName: build:all
 
-    - task: Npm@1
-      inputs:
-          command: custom
-          customCommand: run test:e2e -- --ci
+    - script: yarn test:e2e -- --ci
       displayName: run e2e tests

pipeline/prerequisites.yaml

@@ -6,8 +6,5 @@ steps:
           versionSpec: '10.15.0'
       displayName: use node 10.15.0
 
-    - task: Npm@1
-      inputs:
-          command: custom
-          customCommand: ci
-      displayName: npm ci
+    - script: yarn install --frozen-lockfile
+      displayName: install packages and dependencies

src/tests/end-to-end/common/browser-factory.ts

@@ -44,7 +44,7 @@ async function verifyExtensionIsBuilt(extensionPath: string): Promise<void> {
         throw new Error(
             `Cannot launch extension-enabled browser instance because extension has not been built.\n` +
                 `Expected manifest file ${manifestPath} does not exist.\n` +
-                `Have you run 'npm run build'?`,
+                `Have you run 'yarn build'?`,
         );
     }
 }