✅ Add missing redirects and Cypress tests for them

.github/workflows/test.yml

@@ -34,3 +34,15 @@ jobs:
         with:
           build: npm run build
           start: npm run preview
+      - uses: actions/upload-artifact@v4
+        if: failure()
+        with:
+          name: cypress-screenshots
+          path: cypress/screenshots
+          if-no-files-found: ignore
+      - uses: actions/upload-artifact@v4
+        if: failure()
+        with:
+          name: cypress-videos
+          path: cypress/videos
+          if-no-files-found: ignore

cypress.config.js

@@ -9,5 +9,7 @@ export default defineConfig({
       return plugins(on, config)
     },
     baseUrl: 'http://localhost:6602',
+    video: true,
+    screenshotOnRunFailure: true,
   },
 })

cypress/e2e/index.cy.js

@@ -19,7 +19,17 @@ describe('when an organiser wants to schedule a social', () => {
 
     cy.location('pathname').then(pathname => {
       const socialId = pathname.split('/')[1]
-      cy.task('updateSocial', {id: socialId, data: '2024-01-02'})
+      cy.task('updateSocial', {
+        id: socialId,
+        data: {
+          invitees: {
+            fakeId: {
+              name: 'Max',
+              dates: ['2024-01-02'],
+            },
+          },
+        },
+      })
     })
     cy.reload() // This shouldn't be necessary but HTTP2 isn't supported by Cypress so streaming doesn't work
     cy.get('.invitee').should('contain.text', 'Max')
@@ -55,7 +65,7 @@ describe('when an invitee has chosen their availability', () => {
     cy.visit(`/${this.social.id}/everyone`)
     cy.contains('BACK').click()
 
-    // Force a wait for the page to re-render, think this may be caused by the SvelteKit server does intiial render in current time.
+    // Force a wait for the page to re-render and display date properly, not sure why this re-render happens.
     cy.contains('January 1970').should('exist')
     cy.contains('.calendar-date', /^3$/).click()
     cy.contains('.calendar-date', /^4$/).click()
@@ -65,9 +75,9 @@ describe('when an invitee has chosen their availability', () => {
       .table()
       .should('deep.equal', [
         ['', 'Rank', 'Date', 'Available Invitees', 'Invitees Total'],
-        ['', '1', 'Saturday, 3 January', '🤴🧙‍♂️', '2/2'],
-        ['', '2', 'Sunday, 4 January', '🤴🧙‍♂️', '2/2'],
-        ['', '3', 'Friday, 2 January', '🤴', '1/2'],
+        ['', '1', formattedDate('1970-01-03'), '🤴🧙‍♂️', '2/2'],
+        ['', '2', formattedDate('1970-01-04'), '🤴🧙‍♂️', '2/2'],
+        ['', '3', formattedDate('1970-01-02'), '🤴', '1/2'],
       ])
   })
 })
@@ -91,9 +101,49 @@ describe('when a decision has been made', () => {
     cy.setCookie('userId', 'inviteeID')
   })
 
-  it.skip('anyone can go back and amend it', () => {})
+  it('anyone can go back and amend it', function () {
+    cy.visit(`/${this.social.id}/decision`)
+    cy.contains(`Your social is on ${formattedDate('1970-01-03')}`)
+    cy.contains('BACK').click()
+    cy.contains('#best-dates', formattedDate('1970-01-02')).click()
+    cy.contains('button', 'NEXT').click()
+    cy.contains(`Your social is on ${formattedDate('1970-01-02')}`)
+  })
+
+  it("redirects invitees when they haven't seen the latest decision", function () {
+    cy.visit(`/${this.social.id}/everyone`)
+    cy.url('pathname').should('include', '/decision')
+    cy.waitUntil(() => cy.getCookie('decision'))
+
+    cy.clearCookie('decision')
+    cy.visit(`/${this.social.id}/you`)
+    cy.url('pathname').should('include', '/decision')
+    cy.waitUntil(() => cy.getCookie('decision'))
+    cy.clearCookie('decision')
+    cy.visit(`/${this.social.id}/invite`)
+    cy.url('pathname').should('include', '/decision')
+    cy.waitUntil(() => cy.getCookie('decision'))
+    cy.clearCookie('decision')
+    cy.visit(`/${this.social.id}`)
+    cy.url('pathname').should('include', '/decision')
+    cy.waitUntil(() => cy.getCookie('decision'))
 
-  it.skip("redirects invitees who haven't seen it yet", () => {})
+    cy.visit(`/${this.social.id}/everyone`)
+    cy.url('pathname').should('not.include', '/decision')
+    cy.visit(`/${this.social.id}/you`)
+    cy.url('pathname').should('not.include', '/decision')
+    cy.visit(`/${this.social.id}/invite`)
+    cy.url('pathname').should('not.include', '/decision')
+    cy.visit(`/${this.social.id}`)
+    cy.url('pathname').should('not.include', '/decision')
+
+    cy.task('updateSocial', {
+      id: this.social.id,
+      data: {decision: '1970-01-02'},
+    })
+    cy.visit(`/${this.social.id}/everyone`)
+    cy.url('pathname').should('include', '/decision')
+  })
 })
 
 describe('when an invitee joins the social', () => {
@@ -105,5 +155,14 @@ describe('when an invitee joins the social', () => {
 })
 
 describe('when an invitee from another timezone joins the social', () => {
+  // Not sure how to test this yet. Manually tested by changing OS timezone.
   it.skip('shows them the same dates as others disregarding timezones entirely', () => {})
 })
+
+function formattedDate(date) {
+  return new Date(date).toLocaleDateString(undefined, {
+    weekday: 'long',
+    month: 'long',
+    day: 'numeric',
+  })
+}

cypress/plugins/index.js

@@ -32,10 +32,7 @@ import {toSocialId, toDatabaseId} from '../../src/lib/id.js'
  * @type {Cypress.PluginConfig}
  */
 // eslint-disable-next-line no-unused-vars
-export default (on, config) => {
-  // `on` is used to hook into various events Cypress emits
-  // `config` is the resolved Cypress config
-
+export default (on, _config) => {
   on('task', {
     async createSocial(data) {
       const faunaData = {
@@ -51,17 +48,14 @@ export default (on, config) => {
     },
     async updateSocial({id, data}) {
       const reference = toDatabaseId(id)
+      const faunaData = {
+        data: {
+          ...faunaify(data),
+        },
+      }
+
       const response = await client.query(
-        q.Update(q.Ref(q.Collection('social'), reference), {
-          data: {
-            invitees: {
-              fakeId: {
-                name: 'Max',
-                dates: [q.Date(data)],
-              },
-            },
-          },
-        }),
+        q.Update(q.Ref(q.Collection('social'), reference), faunaData),
       )
       return response
     },
@@ -83,16 +77,23 @@ const defaultSocial = {
 }
 
 function faunaify(data) {
-  return {
-    invitees: Object.fromEntries(
+  let faunaData = {}
+  if (data.invitees) {
+    faunaData.invitees = Object.fromEntries(
       Object.entries(data.invitees).map(([id, invitee]) => [
         id,
         {
           name: invitee.name,
           dates: invitee.dates.map(date => q.Date(date)),
         },
       ]),
-    ),
-    organizer: data.organizer,
+    )
+  }
+  if (data.organizer) {
+    faunaData.organizer = data.organizer
+  }
+  if (data.decision) {
+    faunaData.decision = q.Date(data.decision)
   }
+  return faunaData
 }

cypress/support/commands.js

@@ -25,3 +25,4 @@
 // Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
 
 import 'cypress-map/commands/table'
+import 'cypress-wait-until'

package.json

@@ -23,6 +23,7 @@
     "ava": "^4.0.0",
     "cypress": "^13.6.4",
     "cypress-map": "^1.30.0",
+    "cypress-wait-until": "^3.0.1",
     "dotenv": "^16.4.2",
     "fauna-shell": "^0.13.0",
     "gitmoji-cli": "^9.1.0",

src/lib/redirectToDecision.js

@@ -0,0 +1,16 @@
+import cookie from 'cookie'
+
+export function hasDecisionBeenSeen(request, social) {
+  const cookieHeader = request.headers.get('cookie')
+  const cookies = cookie.parse(cookieHeader || '')
+  return social.decision !== cookies.decision
+}
+
+export function decisionRedirect(socialId) {
+  return {
+    status: 303,
+    headers: {
+      location: `/${socialId}/decision`,
+    },
+  }
+}

src/routes/[socialId=socialId]/decision.svelte

@@ -1,5 +1,6 @@
 <script context="module">
   import Retreat from '$lib/Back.svelte'
+  import cookie from 'cookie'
 </script>
 
 <script>
@@ -17,7 +18,7 @@
   )
 
   onMount(() => {
-    sessionStorage.setItem('decisionSeen', social.decision)
+    document.cookie = cookie.serialize('decision', social.decision)
   })
 </script>
 

src/routes/[socialId=socialId]/everyone.js

@@ -2,6 +2,7 @@ import faunadb from 'faunadb'
 import {toDatabaseId} from '$lib/id'
 import notification from '$lib/server/notification'
 import convertDatesToStrings from '$lib/convertDatesToStrings'
+import {decisionRedirect, hasDecisionBeenSeen} from '$lib/redirectToDecision'
 
 const q = faunadb.query
 
@@ -12,7 +13,7 @@ const client = new faunadb.Client({
   secret: process.env.FAUNADB_SERVER_SECRET,
 })
 
-export async function get({params, locals}) {
+export async function get({params, locals, request}) {
   const socialId = params.socialId
   const reference = toDatabaseId(socialId)
   const response = await client.query(
@@ -22,6 +23,8 @@ export async function get({params, locals}) {
   if (social.decision) social.decision = social.decision.value
   const user = social.invitees[locals.userId]
 
+  if (hasDecisionBeenSeen(request, social)) return decisionRedirect(socialId)
+
   return {
     status: 200,
     body: {

src/routes/[socialId=socialId]/everyone.svelte

@@ -14,6 +14,7 @@
   import StreamingStatus from '$lib/StreamingStatus.svelte'
   import Inviter from '$lib/Inviter.svelte'
   import push from '$lib/push'
+  import cookie from 'cookie'
 
   const {getAnalytics} = getContext('analytics')
 
@@ -59,7 +60,7 @@
 
           const newDecision =
             social.decision &&
-            social.decision.value !== sessionStorage.getItem('decisionSeen')
+            social.decision.value !== cookie.parse(document.cookie).decision
           if (newDecision) goto('decision')
 
           status = '📡 Updated: someone joined the party!'

src/routes/[socialId=socialId]/index.js

@@ -0,0 +1,34 @@
+import faunadb from 'faunadb'
+import {toDatabaseId} from '$lib/id'
+import convertDatesToStrings from '$lib/convertDatesToStrings'
+import {decisionRedirect, hasDecisionBeenSeen} from '$lib/redirectToDecision'
+
+const q = faunadb.query
+
+const client = new faunadb.Client({
+  domain: process.env.FAUNADB_DOMAIN,
+  port: process.env.FAUNADB_PORT,
+  scheme: process.env.FAUNADB_SCHEME,
+  secret: process.env.FAUNADB_SERVER_SECRET,
+})
+
+export async function get({params, locals, request}) {
+  const socialId = params.socialId
+  const reference = toDatabaseId(socialId)
+  const response = await client.query(
+    q.Get(q.Ref(q.Collection('social'), reference)),
+  )
+  const social = convertDatesToStrings(response.data)
+  if (social.decision) social.decision = social.decision.value
+  const user = social.invitees[locals.userId]
+
+  if (hasDecisionBeenSeen(request, social)) return decisionRedirect(socialId)
+
+  return {
+    status: 200,
+    body: {
+      social,
+      user,
+    },
+  }
+}

src/routes/[socialId=socialId]/invite.js

@@ -19,6 +19,7 @@ export async function get({params, locals}) {
     q.Get(q.Ref(q.Collection('social'), reference)),
   )
   const social = convertDatesToStrings(response.data)
+  if (social.decision) social.decision = social.decision.value
   const user = social.invitees[locals.userId]
 
   if (user) {

src/routes/[socialId=socialId]/you.js

@@ -1,6 +1,7 @@
 import faunadb from 'faunadb'
 import {toDatabaseId} from '$lib/id'
 import convertDatesToStrings from '$lib/convertDatesToStrings'
+import {decisionRedirect, hasDecisionBeenSeen} from '$lib/redirectToDecision'
 
 const q = faunadb.query
 
@@ -11,15 +12,18 @@ const client = new faunadb.Client({
   secret: process.env.FAUNADB_SERVER_SECRET,
 })
 
-export async function get({params, locals}) {
+export async function get({params, locals, request}) {
   const socialId = params.socialId
   const reference = toDatabaseId(socialId)
   const response = await client.query(
     q.Get(q.Ref(q.Collection('social'), reference)),
   )
   const social = convertDatesToStrings(response.data)
+  if (social.decision) social.decision = social.decision.value
   const user = social.invitees[locals.userId]
 
+  if (hasDecisionBeenSeen(request, social)) return decisionRedirect(socialId)
+
   return {
     status: 200,
     body: {

src/routes/__layout.svelte

@@ -41,7 +41,7 @@
       dsn: 'https://5b7a4ba6b3ff446ea520d3b5d7b854f2@o1232542.ingest.sentry.io/6380542',
       integrations: [Sentry.browserTracingIntegration(), feedback],
       tracesSampleRate: 1.0,
-      enabled: !dev,
+      enabled: !dev && document.location.hostname === 'scheduleyour.social', // TODO: Expose CI env var here instead of checking hostname
     })
     feedback.attachTo(document.getElementById('feedback')) // This is in Footer