2.1.9

.circleci/config.yml

@@ -59,6 +59,65 @@ jobs:
           at: ~/spectrum
       - run: cd ./mobile && yarn test:unit
 
+  # Test the web JS
+  test_web_js:
+    <<: *defaults
+    docker:
+      - image: circleci/node:8-browsers
+      - image: redis:3.2.7
+      - image: cypress/base:6
+    environment:
+      TERM: xterm
+    steps:
+      - attach_workspace:
+          at: ~/spectrum
+      - run:
+          name: Install RethinkDB 2.3.5
+          command:
+            |
+              echo "deb http://download.rethinkdb.com/apt jessie main" | sudo tee /etc/apt/sources.list.d/rethinkdb.list
+              wget -qO- http://download.rethinkdb.com/apt/pubkey.gpg | sudo apt-key add -
+              sudo apt-get update
+              sudo apt-get install rethinkdb=2.3.5~0jessie
+      - run:
+          name: Start RethinkDB
+          command: rethinkdb --bind all
+          background: true
+      - run: sleep 10
+      - run:
+          name: Setup and build
+          command:
+            |
+              node -e "const setup = require('./shared/testing/setup.js')().then(() => process.exit())"
+              yarn run build:web
+              yarn run build:iris
+      - run:
+          name: Start Iris in the background
+          command: TEST_DB=true yarn run dev:iris
+          background: true
+      - run:
+          name: Start web client in the background
+          command: yarn run dev:web
+          background: true
+      - run: sleep 60
+      - run:
+          name: Run Flow
+          command: yarn run flow
+      - run:
+          name: Run ESLint
+          command: yarn run lint
+      - run:
+          name: Run Unit Tests
+          command: yarn run test:ci
+      - run:
+          name: Run E2E Tests
+          command: yarn run test:e2e
+      - run:
+          name: Danger
+          when: always
+          command: yarn run danger ci
+
+
   # Tests native code of the mobile app
   test_mobile_native:
     <<: *macos_defaults
@@ -100,3 +159,11 @@ workflows:
       # - test_mobile_native:
       #     requires:
       #       - checkout_environment
+
+  # Tests web app
+  test_web:
+    jobs:
+      - checkout_environment
+      - test_web_js:
+          requires:
+            - checkout_environment

.github/ISSUE_TEMPLATE.md

@@ -0,0 +1,15 @@
+<!--
+FILL OUT THE FORM BELOW OR THE ISSUE WILL BE AUTO-CLOSED
+
+**Issue Type (check one)**
+
+- [ ] Bug Report
+- [ ] Feature Idea
+- [ ] Technical Discussion
+- [ ] Question (these will be auto-closed, please ask them on Spectrum instead https://spectrum.chat/spectrum/open)
+-->
+
+**Description (type any text below)**
+
+
+

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,25 +1,22 @@
-### Deploy after merge (delete what needn't be deployed)
-- iris
-- hyperion
+<!-- FILL OUT THE BELOW FORM OR YOUR PR WILL BE AUTOMATICALLY CLOSED -->
+**Status**
+- [ ] WIP
+- [ ] Ready for review
+- [ ] Needs testing
+
+**Deploy after merge (delete what needn't be deployed)**
+- iris (api)
+- hyperion (frontend)
 - athena
 - vulcan
 - mercury
 - hermes
 - chronos
+- mobile
 
-### Run database migrations (delete if not)
+**Run database migrations (delete if no migration was added)**
 YES
 
-## Release notes
+**Release notes for users (delete if codebase-only change)**
 -
 
-<!--
-### Labels
-
-Please check the checkboxes below for any labels you want assigned to the PR:
-
-- [ ] WIP
-- [ ] Ready for review
-- [ ] Needs testing
-
--->

cypress.json

@@ -0,0 +1,4 @@
+{
+  "baseUrl": "http://localhost:3000",
+  "viewportWidth": 1300
+}

cypress/fixtures/example.json

@@ -0,0 +1,5 @@
+{
+  "name": "Using fixtures to represent data",
+  "email": "[email protected]",
+  "body": "Fixtures are a great way to mock data for responses to routes"
+}

cypress/integration/channel_spec.js

@@ -0,0 +1,24 @@
+import data from '../../shared/testing/data';
+
+const channel = data.channels[0];
+const community = data.communities.find(
+  community => community.id === channel.communityId
+);
+
+describe('Channel View', () => {
+  // Before every test suite set up a new browser and page
+  before(() => {
+    cy.visit(`/${community.slug}/${channel.slug}`);
+  });
+
+  it('should render', () => {
+    cy.get('[data-e2e-id="channel-view"]').should('be.visible');
+    cy.contains(channel.description);
+    cy.contains(channel.name);
+    data.threads
+      .filter(thread => thread.channelId === channel.id)
+      .forEach(thread => {
+        cy.contains(thread.content.title);
+      });
+  });
+});

cypress/integration/community_spec.js

@@ -0,0 +1,33 @@
+import data from '../../shared/testing/data';
+
+const community = data.communities[0];
+
+describe('Community View', () => {
+  beforeEach(() => {
+    cy.visit(`/${community.slug}`);
+  });
+
+  it('should render all the communities data, and show a list of channels and threads', () => {
+    cy.get('[data-e2e-id="community-view"]').should('be.visible');
+    cy.contains(community.description);
+    cy.contains(community.name);
+    cy.contains(community.website);
+    cy.get(`[src*="${community.profilePhoto}"]`).should('be.visible');
+    // TODO: Actually use a Cypress API for this instead of this hacky shit
+    cy.document().then(document => {
+      expect(document.body.toString().indexOf(community.coverPhoto) > -1);
+    });
+
+    data.threads
+      .filter(thread => thread.communityId === community.id)
+      .forEach(thread => {
+        cy.contains(thread.content.title).should('be.visible');
+      });
+
+    data.channels
+      .filter(channel => channel.communityId === community.id)
+      .forEach(channel => {
+        cy.contains(channel.name).should('be.visible');
+      });
+  });
+});

cypress/integration/inbox_spec.js

@@ -0,0 +1,32 @@
+import data from '../../shared/testing/data';
+
+const user = data.users[0];
+const channelIds = data.usersChannels
+  .filter(({ userId }) => userId === user.id)
+  .map(({ channelId }) => channelId);
+const dashboardThreads = data.threads.filter(({ channelId }) =>
+  channelIds.includes(channelId)
+);
+
+describe('Inbox View', () => {
+  before(() => {
+    cy.auth(user.id);
+    cy.visit('/');
+  });
+
+  it('should render the inbox view', () => {
+    cy.get('[data-e2e-id="inbox-view"]').should('be.visible');
+    dashboardThreads.forEach(thread => {
+      cy.contains(thread.content.title);
+    });
+    const usersCommunities = data.usersCommunities
+      .filter(({ userId }) => user.id === userId)
+      .map(({ communityId }) =>
+        data.communities.find(({ id }) => id === communityId)
+      );
+    usersCommunities.forEach(community => {
+      cy.contains(community.name);
+    });
+    cy.get('[data-e2e-id="thread-view"]').should('be.visible');
+  });
+});

cypress/integration/login_spec.js

@@ -0,0 +1,15 @@
+describe('Login View', () => {
+  beforeEach(() => {
+    cy.visit('/login');
+  });
+
+  it('should render', () => {
+    cy.get('[data-e2e-id="login-page"]').should('be.visible');
+    cy.get('[href*="/auth/twitter"]').should('be.visible');
+    cy.get('[href*="/auth/facebook"]').should('be.visible');
+    cy.get('[href*="/auth/google"]').should('be.visible');
+    cy
+      .get('[href*="github.com/withspectrum/code-of-conduct"]')
+      .should('be.visible');
+  });
+});

cypress/integration/splash_spec.js

@@ -0,0 +1,11 @@
+describe('Splash View', () => {
+  before(() => {
+    cy.visit('/');
+  });
+
+  it('should render the splash page', () => {
+    cy.get('[data-e2e-id="splash-page"]').should('be.visible');
+    cy.get('[href*="/login"]').should('be.visible');
+    cy.get('[href*="/new/community"]').should('be.visible');
+  });
+});

cypress/integration/thread_spec.js

@@ -0,0 +1,36 @@
+import { toPlainText, toState } from '../../shared/draft-utils';
+import data from '../../shared/testing/data';
+
+const thread = data.threads[0];
+const channel = data.channels.find(channel => channel.id === thread.channelId);
+const community = data.communities.find(
+  community => community.id === thread.communityId
+);
+const author = data.users.find(user => user.id === thread.creatorId);
+const messages = data.messages.filter(
+  message => message.threadId === thread.id
+);
+
+describe('Thread View', () => {
+  // Before every test suite set up a new browser and page
+  before(() => {
+    cy.visit(`/thread/${thread.id}`);
+  });
+
+  it('should render', () => {
+    cy.get('[data-e2e-id="thread-view"]').should('be.visible');
+    cy.contains(thread.content.title);
+    cy.contains(
+      toPlainText(toState(JSON.parse(thread.content.body))).split(' ')[0]
+    );
+    cy.contains(author.name);
+    cy.contains(author.username);
+    cy.get(`[href*="/users/${author.username}"]`).should('be.visible');
+    cy.get(`[href*="/${community.slug}"]`).should('be.visible');
+
+    cy.get('[data-e2e-id="message-group"]').should('be.visible');
+    messages.forEach(message => {
+      cy.contains(toPlainText(toState(JSON.parse(message.content.body))));
+    });
+  });
+});

cypress/integration/user_spec.js

@@ -0,0 +1,40 @@
+import data from '../../shared/testing/data';
+
+const user = data.users[0];
+
+describe('User View', () => {
+  before(() => {
+    cy.visit(`/users/${user.username}`);
+  });
+
+  it('should render', () => {
+    cy.get('[data-e2e-id="user-view"]').should('be.visible');
+    cy.contains(user.username);
+    cy.contains(user.name);
+    cy.contains(user.description);
+    cy.contains(user.website);
+    cy.get('[data-e2e-id="thread-feed"]').should('be.visible');
+    data.threads
+      .filter(thread => thread.creatorId === user.id)
+      .forEach(thread => {
+        cy.contains(thread.content.title);
+      });
+  });
+
+  it('should list the communities a user is a member of, including their rep in that community', () => {
+    const usersCommunities = data.usersCommunities.filter(
+      ({ userId }) => userId === user.id
+    );
+    const communityIds = usersCommunities.map(({ communityId }) => communityId);
+    const communities = data.communities.filter(({ id }) =>
+      communityIds.includes(id)
+    );
+    communities.forEach(community => {
+      cy.contains(community.name);
+      const userCommunity = usersCommunities.find(
+        ({ communityId }) => communityId === community.id
+      );
+      cy.contains(userCommunity.reputation);
+    });
+  });
+});

cypress/plugins/index.js

@@ -0,0 +1,17 @@
+// ***********************************************************
+// This example plugins/index.js can be used to load plugins
+//
+// You can change the location of this file or turn off loading
+// the plugins file with the 'pluginsFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/plugins-guide
+// ***********************************************************
+
+// This function is called when a project is opened or re-opened (e.g. due to
+// the project's config changing)
+
+module.exports = (on, config) => {
+  // `on` is used to hook into various events Cypress emits
+  // `config` is the resolved Cypress config
+};

cypress/support/commands.js

@@ -0,0 +1,21 @@
+// ***********************************************
+// This example commands.js shows you how to
+// create various custom commands and overwrite
+// existing commands.
+//
+// For more comprehensive examples of custom
+// commands please read more here:
+// https://on.cypress.io/custom-commands
+// ***********************************************
+import { encode } from '../../iris/utils/base64';
+
+Cypress.Commands.add('auth', userId => {
+  cy.setCookie(
+    'session',
+    encode(JSON.stringify({ passport: { user: userId } })),
+    {
+      httpOnly: true,
+      secure: false,
+    }
+  );
+});