Merge pull request #160 from adr/Issue-#156

Replaced Pizzly as the authentication middleware with Firebase

.github/workflows/tests.yml

@@ -37,7 +37,8 @@ jobs:
           $(npm bin)/cypress verify
       - name: Run Cypress tests
         env:
-          CYPRESS_PIZZLY_E2E_AUTH_ID: ${{ secrets.PIZZLY_E2E_AUTH_ID }}
+          CYPRESS_OAUTH_E2E_AUTH_ID: ${{ secrets.OAUTH_E2E_AUTH_ID }}
+          CYPRESS_USER: ${{ secrets.USER }}
         run: |
           npm start &
           npm run e2e:test-ci

.gitignore

@@ -35,6 +35,7 @@ bower_components
 
 # cypress
 cypress.env.json
+cypress/downloads
 
 # node-waf configuration
 .lock-wscript

README.md

@@ -58,17 +58,18 @@ Note that, even when you run it locally, you need to connect to GitHub to use an
 ### Using End-2-End Tests Locally
 
 We use [Cypress](https://www.cypress.io/) for e2e testing.
-The CI pipeline provides the necessary Pizzly `authId` as an ENV variable.
+The CI pipeline provides the necessary Oauth `authId` as an ENV variable.
 Locally, however, you'll need to provide one yourself.
-You can either set `CYPRESS_PIZZLY_E2E_AUTH_ID` containing the `authId` or create a `cypress.env.json` file and fill it with the following content:
+You can either set `CYPRESS_OAUTH_E2E_AUTH_ID` and `CYPRESS_USER` containing the `authId` and `user` or create a `cypress.env.json` file and fill it with the following content:
 
 ```json
 {
-  "PIZZLY_E2E_AUTH_ID": "*********"
+  "OAUTH_E2E_AUTH_ID": "*********",
+  "USER": "***********"
 }
 ```
 
-The value of `PIZZLY_E2E_AUTH_ID` needs to be a valid `authId` from an active Pizzly session, which you can obtain a) via the Pizzly dashboard (see below) or b) in the local storage (Chrome developer console -> Application -> Storage -> Local Storage -> `http://localhost:8080` -> `authId`)
+The value of `OAUTH_E2E_AUTH_ID` and `USER` needs to be a valid `authId` and `user` from an active OAuth session, which you can obtain in the local storage (Chrome developer console -> Application -> Storage -> Local Storage -> `http://localhost:8080` -> `authId`, `user`)
 The involved GitHub account also needs to have developer access to the repo `adr/adr-test-repository-empty`.
 Lastly, don't forget to start the app before running the e2e tests (`npm start`).
 
@@ -104,23 +105,14 @@ npm run format
 
 ### Backend Setup
 
-The project uses [Pizzly](https://github.com/bearer/pizzly) for the authentication to GitHub.
-Our Pizzly instance is hosted on Heroku.
+The project uses [OAuth] for the authentication to GitHub.
 If you do not want to use this instance, you can easily set up your own by following these steps:
 
 1. Create an OAuth application on GitHub (see [here](https://docs.github.com/en/github-ae@latest/developers/apps/creating-an-oauth-app)).
    - Copy the Client ID and Client Secret of the app (you'll need them later).
-   - Set the callback URL to `https://[your-app-name].herokuapp.com/auth/callback`, where `[your-app-name]` is the name of the Heroku app you'll create in the next step.
-1. Deploy your own Pizzly instance on Heroku as described at <https://github.com/bearer/pizzly>.
-1. Configure the deployed Pizzly instance.
-   - Open the Pizzly dashboard (`https://{your-app-name}.herokuapp.com`).
-   - Add a new API and choose `GitHub`, then create a new configuration for it.
-   - Enter the `Client ID` and `Client Secret` of your GitHub OAuth app.
-   - As `scopes`, enter `repo`.
-   - Also, consider [securing your Pizzly instance](https://github.com/Bearer/Pizzly/blob/master/docs/securing-your-instance.md).
-1. Update `src/config.js` with the connection details of your Pizzly instance:
-   - Set `pizzlyHost` to the base URL of your Pizzly instance, e.g. `https://{your-app-name}.herokuapp.com/`.
-   - If you secured Pizzly: set `pizzlyPublishableKey` to your publishableKey.
+2. Create a Github app on Firebase and in its configurations, set the Client ID and Client Secret as copied from the above Github app
+
+- Set the callback URL in Github Oauth app configuration to the one provided by Firebase.
 
 ## Project Context
 

cypress/e2e/adrManagerTest/AddNewAdr.cy.js

@@ -1,19 +1,19 @@
-import { TEST_BASE_URL } from "../../support/e2e";
+import { TEST_BASE_URL, REST_LIST_REPO_URL } from "../../support/e2e";
 
 context("Adding a new ADR to a repo", () => {
     it("Create a new ADR", () => {
         window.localStorage.clear();
-        window.localStorage.setItem("authId", Cypress.env("PIZZLY_E2E_AUTH_ID"));
+        window.localStorage.setItem("authId", Cypress.env("OAUTH_E2E_AUTH_ID"));
+        window.localStorage.setItem("user", Cypress.env("USER"));
         cy.visit(TEST_BASE_URL);
-
         // add the ADR-Manager repo
-        cy.intercept("GET", "**/user/repos**").as("getRepos");
+        cy.intercept("GET", REST_LIST_REPO_URL).as("getRepos");
         cy.get("[data-cy=addRepo]").click();
         cy.wait("@getRepos").its("response.statusCode").should("eq", 200);
         cy.get("[data-cy=listRepo]").contains("ADR-Manager").click();
+
         cy.get("[data-cy=addRepoDialog]").click();
         cy.get("[data-cy=repoNameList]").click();
-
         cy.get("[data-cy=adrList]").then((adrList) => {
             // get number of ADRs in repo
             const adrCount = Cypress.$(adrList).length;

cypress/e2e/adrManagerTest/AddRepo.cy.js

@@ -1,24 +1,21 @@
-import { TEST_BASE_URL } from "../../support/e2e";
+import { REST_LIST_REPO_URL, TEST_BASE_URL, REST_REPO_URL } from "../../support/e2e";
 
 context("Listing and adding repositories", () => {
     beforeEach(() => {
         window.localStorage.clear();
-        window.localStorage.setItem("authId", Cypress.env("PIZZLY_E2E_AUTH_ID"));
+        window.localStorage.setItem("authId", Cypress.env("OAUTH_E2E_AUTH_ID"));
+        window.localStorage.setItem("user", Cypress.env("USER"));
         cy.visit(TEST_BASE_URL);
-
-        cy.intercept("GET", "**/user/repos**").as("getRepos");
+        cy.intercept("GET", REST_LIST_REPO_URL).as("getRepos");
         cy.get("[data-cy=addRepo]").click();
         cy.wait("@getRepos").its("response.statusCode").should("eq", 200);
     });
-
     it("Check if at least 1 repository is displayed", () => {
         cy.get("[data-cy=listRepo]").should("have.length.greaterThan", 0);
     });
-
     it("Add all repositories", () => {
         cy.get("[data-cy=listRepo]").then((listing) => {
             const numberOfAddedRepositories = 3;
-
             let counter = 0;
             // add each repo with a click
             cy.get("[data-cy=listRepo]").each(() => {
@@ -31,7 +28,7 @@ context("Listing and adding repositories", () => {
 
             // confirm repo adding dialog
             cy.get("[data-cy=addRepoDialog]").click();
-            cy.intercept("GET", "**/repos**").as("showRepos");
+            cy.intercept("GET", REST_REPO_URL).as("showRepos");
             cy.wait("@showRepos", { timeout: 15000 });
 
             // check if the correct number of repos was added

cypress/e2e/adrManagerTest/DeleteAdr.cy.js

@@ -1,30 +1,28 @@
-import { TEST_BASE_URL } from "../../support/e2e";
+import { REST_REPO_URL, REST_LIST_REPO_URL, TEST_BASE_URL } from "../../support/e2e";
 
 context("Deleting an ADR from a repo", () => {
     it("Remove one ADR", () => {
         window.localStorage.clear();
-        window.localStorage.setItem("authId", Cypress.env("PIZZLY_E2E_AUTH_ID"));
+        window.localStorage.setItem("authId", Cypress.env("OAUTH_E2E_AUTH_ID"));
+        window.localStorage.setItem("user", Cypress.env("USER"));
         cy.visit(TEST_BASE_URL);
-
         // add the ADR-Manager repo
-        cy.intercept("GET", "**/user/repos**").as("getRepos");
+        cy.intercept("GET", REST_LIST_REPO_URL).as("getRepos");
+
         cy.get("[data-cy=addRepo]").click();
         cy.wait("@getRepos").its("response.statusCode").should("eq", 200);
         cy.get("[data-cy=listRepo]").contains("ADR-Manager").click();
         cy.get("[data-cy=addRepoDialog]").click();
-        cy.intercept("GET", "**/repos**").as("showRepos");
+        cy.intercept("GET", REST_REPO_URL).as("showRepos");
         cy.wait("@showRepos", { timeout: 10000 });
-
         cy.get("[data-cy=adrList]").then((adrList) => {
             // get number of ADRs in repo
             const adrCount = Cypress.$(adrList).length;
-
             // delete the last one
             cy.get("[data-cy=deleteAdrBtn]").eq(0).click();
             cy.get("[data-cy=dialogDeleteAdrBtn]").click();
             // check if it's gone
             cy.get("[data-cy=adrList]").should("have.length", adrCount - 1);
-
             cy.get("[data-cy=adrList]").should(() => {
                 // check if localeStorage has been set accordingly
                 const addedRepos = JSON.parse(localStorage.getItem("addedRepositories"));

cypress/e2e/adrManagerTest/DeleteRepo.cy.js

@@ -1,16 +1,15 @@
-import { TEST_BASE_URL } from "../../support/e2e";
+import { TEST_BASE_URL, REST_LIST_REPO_URL } from "../../support/e2e";
 
 context("Deleting repositories", () => {
     it("Remove a repo", () => {
         window.localStorage.clear();
-        window.localStorage.setItem("authId", Cypress.env("PIZZLY_E2E_AUTH_ID"));
+        window.localStorage.setItem("authId", Cypress.env("OAUTH_E2E_AUTH_ID"));
+        window.localStorage.setItem("user", Cypress.env("USER"));
         cy.visit(TEST_BASE_URL);
-
         // add ADR Manager repo
-        cy.intercept("GET", "**/user/repos**").as("getRepos");
+        cy.intercept("GET", REST_LIST_REPO_URL).as("getRepos");
         cy.get("[data-cy=addRepo]").click();
         cy.wait("@getRepos").its("response.statusCode").should("eq", 200);
-
         cy.get("[data-cy=listRepo]").contains("ADR-Manager").click();
         cy.get("[data-cy=addRepoDialog]").click();
         cy.get("[data-cy=repoNameList]").click();

cypress/e2e/adrManagerTest/Modes.cy.js

@@ -1,13 +1,14 @@
-import { TEST_BASE_URL } from "../../support/e2e";
+import { TEST_BASE_URL, REST_LIST_REPO_URL } from "../../support/e2e";
 
 context("Using editor modes", () => {
     it("Switch to professional mode and create a new ADR", () => {
         window.localStorage.clear();
-        window.localStorage.setItem("authId", Cypress.env("PIZZLY_E2E_AUTH_ID"));
+        window.localStorage.setItem("authId", Cypress.env("OAUTH_E2E_AUTH_ID"));
+        window.localStorage.setItem("user", Cypress.env("USER"));
         cy.visit(TEST_BASE_URL);
 
         // add ADR Manager repo
-        cy.intercept("GET", "**/user/repos**").as("getRepos");
+        cy.intercept("GET", REST_LIST_REPO_URL).as("getRepos");
         cy.get("[data-cy=addRepo]").click();
         cy.wait("@getRepos").its("response.statusCode").should("eq", 200);
         cy.get("[data-cy=listRepo]").contains("ADR-Manager").click();

cypress/e2e/adrManagerTest/Parser.cy.js

@@ -1,13 +1,14 @@
-import { TEST_BASE_URL } from "../../support/e2e";
+import { REST_LIST_REPO_URL, TEST_BASE_URL } from "../../support/e2e";
 
 context("Using Markdown modes", () => {
     it("Convert raw Markdown", () => {
         window.localStorage.clear();
-        window.localStorage.setItem("authId", Cypress.env("PIZZLY_E2E_AUTH_ID"));
+        window.localStorage.setItem("authId", Cypress.env("OAUTH_E2E_AUTH_ID"));
+        window.localStorage.setItem("user", Cypress.env("USER"));
         cy.visit(TEST_BASE_URL);
 
         // add ADR Manager repo
-        cy.intercept("GET", "**/user/repos**").as("getRepos");
+        cy.intercept("GET", REST_LIST_REPO_URL).as("getRepos");
         cy.get("[data-cy=addRepo]").click();
         cy.wait("@getRepos").its("response.statusCode").should("eq", 200);
         cy.get("[data-cy=listRepo]").contains("ADR-Manager").click();

cypress/e2e/adrManagerTest/PushNewAdr.cy.js

@@ -1,13 +1,12 @@
-import { TEST_BASE_URL } from "../../support/e2e";
+import { REST_BRANCH_URL, REST_LIST_REPO_URL, REST_COMMIT_URL, TEST_BASE_URL } from "../../support/e2e";
 
 context("Committing, pushing, and remote-deleting an ADR", () => {
     it("Commit and push new ADR, then delete from GitHub", () => {
         const REPO_NAME = "adr/adr-test-repository-empty";
         const BRANCH_NAME = "testing-branch";
 
         function addRepositoryAndSwitchBranch() {
-            // add the ADR-Manager repo
-            cy.intercept("GET", "**/user/repos**").as("getRepos");
+            cy.intercept("GET", REST_LIST_REPO_URL).as("getRepos");
             cy.get("[data-cy=addRepo]").click();
             cy.wait("@getRepos").its("response.statusCode").should("eq", 200);
             cy.get("[data-cy=search-field-for-adding-repository]").type(REPO_NAME);
@@ -30,11 +29,10 @@ context("Committing, pushing, and remote-deleting an ADR", () => {
             // Reloading the repository typically takes some time ...
             cy.wait(2000);
         }
-
         window.localStorage.clear();
-        window.localStorage.setItem("authId", Cypress.env("PIZZLY_E2E_AUTH_ID"));
+        window.localStorage.setItem("authId", Cypress.env("OAUTH_E2E_AUTH_ID"));
+        window.localStorage.setItem("user", Cypress.env("USER"));
         cy.visit(TEST_BASE_URL);
-
         addRepositoryAndSwitchBranch();
 
         // add new ADR
@@ -48,25 +46,16 @@ context("Committing, pushing, and remote-deleting an ADR", () => {
         cy.get("[data-cy=mdiAlertCommitMessage]").should("be.visible");
         // set commit message and commit
         cy.get("[data-cy=newFilesCommitMessage]").click();
-
         cy.get("[data-cy=newFileCheckBoxOuter]").contains(/[0-9][0-9][0-9][0-9]-use-x-to-accomplish-y.md/g);
-
         cy.get("[data-cy=newFileCheckBox]").check({ force: true });
         cy.get("[data-cy=mdiCheckSelected]").should("be.visible");
         cy.get("[data-cy=textFieldCommitMessage]").type("[E2ETest] Add a new ADR");
         cy.get("[data-cy=mdiCheckCommitMessage]").should("be.visible");
         // push to GitHub
-        cy.intercept("GET", "**/repos/**/branches/**").as("getCommitSha");
-        cy.intercept("POST", "**/repos/**/git/commits?**").as("commitRequest");
         cy.get("[data-cy=btnOfDialogCommitForPush]").click();
-        cy.wait("@getCommitSha");
-        cy.wait("@commitRequest").then((val) => {
-            cy.log(val.request);
-            for (let item in val.request) {
-                cy.log(item);
-            }
-            cy.log(val.request.body.author);
-        });
+
+        cy.intercept("GET", REST_BRANCH_URL).as("getCommitSha");
+        cy.intercept("POST", REST_COMMIT_URL).as("commitRequest");
         cy.contains("OK").click();
 
         // Remove repository

cypress/e2e/adrManagerTest/Routing.cy.js

@@ -1,17 +1,16 @@
-import { TEST_BASE_URL } from "../../support/e2e";
-
+import { REST_LIST_REPO_URL, TEST_BASE_URL } from "../../support/e2e";
 context("Routing and correct URLs", () => {
     beforeEach(() => {
         window.localStorage.clear();
-        window.localStorage.setItem("authId", Cypress.env("PIZZLY_E2E_AUTH_ID"));
+        window.localStorage.setItem("authId", Cypress.env("OAUTH_E2E_AUTH_ID"));
+        window.localStorage.setItem("user", Cypress.env("USER"));
         cy.visit(TEST_BASE_URL);
     });
-
     it("URL corresponds to opened repo and ADR", () => {
         cy.url().should("equal", TEST_BASE_URL);
 
         // add the ADR-Manager repo
-        cy.intercept("GET", "**/user/repos**").as("getRepos");
+        cy.intercept("GET", REST_LIST_REPO_URL).as("getRepos");
         cy.get("[data-cy=addRepo]").click();
         cy.wait("@getRepos").its("response.statusCode").should("eq", 200);
         cy.get("[data-cy=listRepo]").contains("ADR-Manager").click();
@@ -22,7 +21,6 @@ context("Routing and correct URLs", () => {
             "equal",
             `${TEST_BASE_URL}/adr/adr-manager/main/0000-use-markdown-architectural-decision-records.md`
         );
-
         cy.get("[data-cy=adrList]").then((adrList) => {
             // get number of ADRs in repo
             const adrCount = Cypress.$(adrList).length;

cypress/support/e2e.js

@@ -19,3 +19,7 @@ import "./commands";
 import "@cypress/code-coverage/support";
 
 export const TEST_BASE_URL = "http://localhost:8000/adr-manager/#/manager";
+export const REST_LIST_REPO_URL = "**/user/repos**";
+export const REST_REPO_URL = "**/repos/**";
+export const REST_BRANCH_URL = "**/repos/**/branches/**";
+export const REST_COMMIT_URL = "**/repos/**/git/commits?**";

docs/evaluation/adr-parsing/README.md

@@ -17,7 +17,7 @@ An automatic test checking whether an ADR can be parsed was implemented.
 
    ```[JavaScript]
    {
-      "PIZZLY_E2E_AUTH_ID": "abcdefg-123456"
+      "OAUTH_E2E_AUTH_ID": "abcdefg-123456"
    }
    ```
 

docs/evaluation/adr-parsing/cypress/integration/EmpiricalAnalysis.js

@@ -72,7 +72,7 @@ context("Empirically test if ADRs can be opened by the ADR-Manager and count how
         window.localStorage.clear();
         window.localStorage.setItem(
             "authId",
-            Cypress.env("PIZZLY_E2E_AUTH_ID")
+            Cypress.env("OAUTH_E2E_AUTH_ID")
         );
 
         cy.intercept("GET", "**/user/repos**").as("getRepos");

index.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
     <head>
         <link

jest.config.js

@@ -20,8 +20,7 @@ export default {
     // A map from regular expressions to module names that allow to stub out resources with a single module
     moduleNameMapper: {
         vue$: "vue/dist/vue.common.js",
-        "^@/(.*)$": "<rootDir>/src/$1",
-        "pizzly-js": "<rootDir>/tests/pizzly-mock.js"
+        "^@/(.*)$": "<rootDir>/src/$1"
     },
     // The test environment that will be used for testing
     testEnvironment: "node",