From 322bb680d8b9cdd3c156770cc470b9d2aff1741b Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Wed, 6 Sep 2023 10:52:32 +0100
Subject: [PATCH 01/18] Delete session from front end storage

---
 .../src/app/components/ConfirmModal.vue       | 50 +++++++++++++++++++
 .../app/components/sessions/SessionsPage.vue  | 46 +++++++++++++++--
 app/static/src/app/localStorageManager.ts     | 12 ++++-
 app/static/src/app/store/sessions/actions.ts  | 10 +++-
 .../src/app/store/sessions/mutations.ts       |  9 +++-
 5 files changed, 119 insertions(+), 8 deletions(-)
 create mode 100644 app/static/src/app/components/ConfirmModal.vue

diff --git a/app/static/src/app/components/ConfirmModal.vue b/app/static/src/app/components/ConfirmModal.vue
new file mode 100644
index 000000000..2f28b316e
--- /dev/null
+++ b/app/static/src/app/components/ConfirmModal.vue
@@ -0,0 +1,50 @@
+<template>
+  <div>
+    <div v-if="open" class="modal-backdrop fade show"></div>
+    <div class="modal" :class="{show: open}" :style="modalStyle">
+      <div class="modal-dialog modal-dialog-centered">
+        <div class="modal-content">
+          <div class="modal-header">
+            <h5 class="modal-title">{{ title }}</h5>
+          </div>
+          <div class="modal-body">
+            {{ props.text }}
+          </div>
+          <div class="modal-footer">
+            <button class="btn btn-primary"
+                    id="ok-session-label"
+                    @click="confirm">Yes</button>
+            <button class="btn btn-outline"
+                    id="cancel-session-label"
+                    @click="close">No</button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {computed} from "vue";
+
+const props = defineProps({
+  open: Boolean,
+  title: String,
+  text: String
+});
+
+const emit = defineEmits(["close", "confirm"]);
+
+const modalStyle = computed(() => {
+  return { display: props.open ? "block" : "none" };
+});
+
+const close = () => {
+  emit("close");
+};
+
+const confirm = () => {
+  emit("confirm");
+  close();
+};
+</script>
diff --git a/app/static/src/app/components/sessions/SessionsPage.vue b/app/static/src/app/components/sessions/SessionsPage.vue
index 100459854..11cce8949 100644
--- a/app/static/src/app/components/sessions/SessionsPage.vue
+++ b/app/static/src/app/components/sessions/SessionsPage.vue
@@ -7,14 +7,15 @@
     <template v-if="sessionsMetadata">
       <template v-if="sessionsMetadata.length">
         <div class="row fw-bold py-2">
-          <div class="col-3 session-col-header">Saved</div>
+          <div class="col-2 session-col-header">Saved</div>
           <div class="col-2 session-col-header">Label</div>
           <div class="col-2 text-center session-col-header">Edit Label</div>
           <div class="col-1 text-center session-col-header">Load</div>
+          <div class="col-1 text-center session-col-header">Delete</div>
           <div class="col-4 text-center session-col-header">Shareable Link</div>
         </div>
         <div class="row py-2" v-for="session in sessionsMetadata" :key="session.id">
-          <div class="col-3 session-col-value session-time">
+          <div class="col-2 session-col-value session-time">
             {{formatDateTime(session.time)}}
             <div v-if="isCurrentSession(session.id)" class="small text-muted">(current session)</div>
           </div>
@@ -34,6 +35,11 @@
               <vue-feather class="inline-icon brand" type="upload"></vue-feather>
             </a>
           </div>
+          <div class="col-1 text-center session-col-value session-delete">
+            <vue-feather class="inline-icon brand clickable"
+                         type="trash-2"
+                         @click="confirmDeleteSession(session.id)"></vue-feather>
+          </div>
           <div class="col-4 session-col-value session-share brand">
               <div class="mx-auto" style="width: 16rem">
                 <span class="session-copy-link clickable" @click="copyLink(session)" @mouseleave="clearLastCopied">
@@ -66,7 +72,15 @@
                         :session-id="selectedSessionId"
                         :session-label="selectedSessionLabel"
                         @close="toggleEditSessionLabelOpen(false)"
+                        @confirm="deleteSession"
     ></edit-session-label>
+    <confirm-modal id="confirm-delete-session"
+                   :title="'Delete session'"
+                   :text="'Do you want to delete this session?'"
+                   :open="confirmDeleteSessionOpen"
+                   @close="toggleConfirmDeleteSessionOpen(false)"
+                   @confirm="deleteSession"
+                  ></confirm-modal>
   </div>
 </template>
 
@@ -83,6 +97,7 @@ import userMessages from "../../userMessages";
 import ErrorsAlert from "../ErrorsAlert.vue";
 import EditSessionLabel from "./EditSessionLabel.vue";
 import { SessionMetadata } from "../../types/responseTypes";
+import ConfirmModal from "../ConfirmModal.vue";
 
 export default defineComponent({
     name: "SessionsPage",
@@ -90,10 +105,12 @@ export default defineComponent({
         ErrorsAlert,
         EditSessionLabel,
         VueFeather,
-        RouterLink
+        RouterLink,
+        ConfirmModal
     },
     setup() {
         const store = useStore();
+        const namespace = "sessions";
 
         const sessionsMetadata = computed(() => store.state.sessions.sessionsMetadata);
         const baseUrl = computed(() => store.state.baseUrl);
@@ -108,6 +125,8 @@ export default defineComponent({
         const lastCopySessionId = ref<string | null>(null);
         const lastCopyMsg = ref<string | null>(null); // Feedback message to show under last copy control clicked
 
+        const sessionIdToDelete = ref("");
+
         const formatDateTime = (isoUTCString: string) => {
             return utc(isoUTCString).local().format("DD/MM/YYYY HH:mm:ss");
         };
@@ -133,7 +152,7 @@ export default defineComponent({
                 return session.friendlyId;
             }
             lastCopyMsg.value = "Fetching code...";
-            await store.dispatch(`sessions/${SessionsAction.GenerateFriendlyId}`, session.id);
+            await store.dispatch(`${namespace}/${SessionsAction.GenerateFriendlyId}`, session.id);
             await nextTick();
             const friendlyId = sessionsMetadata.value.find((m: SessionMetadata) => m.id === session.id)?.friendlyId;
             if (!friendlyId) {
@@ -171,8 +190,21 @@ export default defineComponent({
             lastCopyMsg.value = null;
         };
 
+        const confirmDeleteSessionOpen = ref(false);
+        const toggleConfirmDeleteSessionOpen = (open: boolean) => {
+          confirmDeleteSessionOpen.value = open;
+        }
+        const confirmDeleteSession = (sessionId: string) => {
+          sessionIdToDelete.value = sessionId;
+          toggleConfirmDeleteSessionOpen(true);
+        };
+
+        const deleteSession = () => {
+          store.dispatch(`${namespace}/${SessionsAction.DeleteSession}`, sessionIdToDelete.value);
+        }
+
         onMounted(() => {
-            store.dispatch(`sessions/${SessionsAction.GetSessions}`);
+            store.dispatch(`${namespace}/${SessionsAction.GetSessions}`);
         });
 
         const messages = userMessages.sessions;
@@ -187,12 +219,16 @@ export default defineComponent({
             selectedSessionLabel,
             lastCopySessionId,
             lastCopyMsg,
+            confirmDeleteSessionOpen,
             editSessionLabel,
             toggleEditSessionLabelOpen,
             copyLink,
             copyCode,
             getCopyMsg,
             clearLastCopied,
+            confirmDeleteSession,
+            toggleConfirmDeleteSessionOpen,
+            deleteSession,
             messages
         };
     }
diff --git a/app/static/src/app/localStorageManager.ts b/app/static/src/app/localStorageManager.ts
index 9d4dc5172..a36fbc82f 100644
--- a/app/static/src/app/localStorageManager.ts
+++ b/app/static/src/app/localStorageManager.ts
@@ -9,10 +9,20 @@ class LocalStorageManager {
         return (serialised ? JSON.parse(serialised) : []) as string[];
     }
 
+    saveSessionIds = (appName: string, basePath: string, sessionIds: string[]) => {
+        window.localStorage.setItem(LocalStorageManager._sessionIdsKey(appName, basePath), JSON.stringify(sessionIds));
+    }
+
     addSessionId = (appName: string, basePath: string, sessionId: string) => {
         const sessionIds = this.getSessionIds(appName, basePath);
         sessionIds.unshift(sessionId); // prepends the id
-        window.localStorage.setItem(LocalStorageManager._sessionIdsKey(appName, basePath), JSON.stringify(sessionIds));
+        this.saveSessionIds(appName, basePath, sessionIds);
+    }
+
+    deleteSessionId = (appName: string, basePath: string, sessionId: string) => {
+        let sessionIds = this.getSessionIds(appName, basePath);
+        sessionIds = sessionIds.filter((s) => s !== sessionId);
+        this.saveSessionIds(appName, basePath, sessionIds);
     }
 }
 
diff --git a/app/static/src/app/store/sessions/actions.ts b/app/static/src/app/store/sessions/actions.ts
index 45bb10a90..06651f216 100644
--- a/app/static/src/app/store/sessions/actions.ts
+++ b/app/static/src/app/store/sessions/actions.ts
@@ -17,7 +17,8 @@ export enum SessionsAction {
     GetSessions = "GetSessions",
     Rehydrate = "Rehydrate",
     SaveSessionLabel = "SaveSessionLabel",
-    GenerateFriendlyId = "GenerateFriendlyId"
+    GenerateFriendlyId = "GenerateFriendlyId",
+    DeleteSession = "DeleteSession"
 }
 
 interface SaveSessionLabelPayload {
@@ -99,5 +100,12 @@ export const actions: ActionTree<SessionsState, AppState> = {
         if (response) {
             commit(SessionsMutation.SetSessionFriendlyId, { sessionId, friendlyId: response.data });
         }
+    },
+
+    async [SessionsAction.DeleteSession](context, sessionId: string) {
+        const { rootState, rootGetters, commit } = context;
+        const { appName } = rootState;
+        localStorageManager.deleteSessionId(appName!, rootGetters[AppStateGetter.baseUrlPath], sessionId);
+        commit(SessionsMutation.RemoveSessionId, sessionId);
     }
 };
diff --git a/app/static/src/app/store/sessions/mutations.ts b/app/static/src/app/store/sessions/mutations.ts
index bff01501f..ac660594d 100644
--- a/app/static/src/app/store/sessions/mutations.ts
+++ b/app/static/src/app/store/sessions/mutations.ts
@@ -4,7 +4,8 @@ import { SessionMetadata } from "../../types/responseTypes";
 
 export enum SessionsMutation {
     SetSessionsMetadata = "SetSessionsMetadata",
-    SetSessionFriendlyId = "SetSessionFriendlyId"
+    SetSessionFriendlyId = "SetSessionFriendlyId",
+    RemoveSessionId = "RemoveSessionId"
 }
 
 export interface SetSessionFriendlyIdPayload {
@@ -22,5 +23,11 @@ export const mutations: MutationTree<SessionsState> = {
         if (sessionMetadata) {
             sessionMetadata.friendlyId = payload.friendlyId;
         }
+    },
+
+    [SessionsMutation.RemoveSessionId](state: SessionsState, payload: string) {
+        if (state.sessionsMetadata) {
+            state.sessionsMetadata = state.sessionsMetadata.filter((s) => s.id !== payload);
+        }
     }
 };

From d657c96a3783a6e449e56897faffc9a5e9afadaf Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Wed, 6 Sep 2023 14:36:57 +0100
Subject: [PATCH 02/18] component unit tests

---
 .../src/app/components/ConfirmModal.vue       |  4 +-
 .../unit/components/confirmModal.test.ts      | 36 ++++++++
 .../components/sessions/sessionsPage.test.ts  | 85 +++++++++++++------
 3 files changed, 96 insertions(+), 29 deletions(-)
 create mode 100644 app/static/tests/unit/components/confirmModal.test.ts

diff --git a/app/static/src/app/components/ConfirmModal.vue b/app/static/src/app/components/ConfirmModal.vue
index 2f28b316e..39a2136b1 100644
--- a/app/static/src/app/components/ConfirmModal.vue
+++ b/app/static/src/app/components/ConfirmModal.vue
@@ -12,10 +12,10 @@
           </div>
           <div class="modal-footer">
             <button class="btn btn-primary"
-                    id="ok-session-label"
+                    id="confirm-yes"
                     @click="confirm">Yes</button>
             <button class="btn btn-outline"
-                    id="cancel-session-label"
+                    id="confirm-no"
                     @click="close">No</button>
           </div>
         </div>
diff --git a/app/static/tests/unit/components/confirmModal.test.ts b/app/static/tests/unit/components/confirmModal.test.ts
new file mode 100644
index 000000000..6d61bd203
--- /dev/null
+++ b/app/static/tests/unit/components/confirmModal.test.ts
@@ -0,0 +1,36 @@
+import { mount } from "@vue/test-utils";
+import ConfirmModal from "../../../src/app/components/ConfirmModal.vue";
+
+describe("ConfirmModal", () => {
+    const getWrapper = (open = true, title = "Delete something", text = "Really?") => {
+        return mount(ConfirmModal, { props: { title, text, open } });
+    };
+
+    it("renders as expected", () => {
+        const wrapper = getWrapper();
+        expect(wrapper.find(".modal-title").text()).toBe("Delete something");
+        expect(wrapper.find(".modal-body").text()).toBe("Really?");
+        expect(wrapper.find("button#confirm-yes").text()).toBe("Yes");
+        expect(wrapper.find("button#confirm-no").text()).toBe("No");
+        expect((wrapper.find("div.modal").element as HTMLDivElement).style.display).toBe("block");
+    });
+
+    it("hides modal when not open", () => {
+        const wrapper = getWrapper(false);
+        expect((wrapper.find("div.modal").element as HTMLDivElement).style.display).toBe("none");
+    });
+
+    it("No button emits close", async () => {
+        const wrapper = getWrapper();
+        await wrapper.find("button#confirm-no").trigger("click");
+        expect(wrapper.emitted("close")!.length).toBe(1);
+        expect(wrapper.emitted("confirm")).toBe(undefined);
+    });
+
+    it("Yes button emits close and confirm", async () => {
+        const wrapper = getWrapper();
+        await wrapper.find("button#confirm-yes").trigger("click");
+        expect(wrapper.emitted("close")!.length).toBe(1);
+        expect(wrapper.emitted("confirm")!.length).toBe(1);
+    });
+});
diff --git a/app/static/tests/unit/components/sessions/sessionsPage.test.ts b/app/static/tests/unit/components/sessions/sessionsPage.test.ts
index 75cbcc4ba..8191aacd2 100644
--- a/app/static/tests/unit/components/sessions/sessionsPage.test.ts
+++ b/app/static/tests/unit/components/sessions/sessionsPage.test.ts
@@ -9,11 +9,13 @@ import { mockBasicState } from "../../../mocks";
 import { SessionsAction } from "../../../../src/app/store/sessions/actions";
 import { SessionMetadata } from "../../../../src/app/types/responseTypes";
 import EditSessionLabel from "../../../../src/app/components/sessions/EditSessionLabel.vue";
+import ConfirmModal from "../../../../src/app/components/ConfirmModal.vue";
 
 describe("SessionsPage", () => {
     const mockGetSessions = jest.fn();
     const mockGenerateFriendlyId = jest.fn();
     const mockClipboardWriteText = jest.fn();
+    const mockDeleteSession = jest.fn();
 
     Object.assign(window.navigator, {
         clipboard: {
@@ -41,7 +43,8 @@ describe("SessionsPage", () => {
                     },
                     actions: {
                         [SessionsAction.GetSessions]: mockGetSessions,
-                        [SessionsAction.GenerateFriendlyId]: mockGenerateFriendlyId
+                        [SessionsAction.GenerateFriendlyId]: mockGenerateFriendlyId,
+                        [SessionsAction.DeleteSession]: mockDeleteSession
                     }
                 }
             }
@@ -70,38 +73,41 @@ describe("SessionsPage", () => {
         const rows = wrapper.findAll(".container .row");
         expect(rows.at(0)!.find("h2").text()).toBe("Sessions");
         const columnHeaders = rows.at(1)!.findAll("div.session-col-header");
-        expect(columnHeaders.length).toBe(5);
+        expect(columnHeaders.length).toBe(6);
         expect(columnHeaders.at(0)!.text()).toBe("Saved");
         expect(columnHeaders.at(1)!.text()).toBe("Label");
         expect(columnHeaders.at(2)!.text()).toBe("Edit Label");
         expect(columnHeaders.at(3)!.text()).toBe("Load");
-        expect(columnHeaders.at(4)!.text()).toBe("Shareable Link");
+        expect(columnHeaders.at(4)!.text()).toBe("Delete");
+        expect(columnHeaders.at(5)!.text()).toBe("Shareable Link");
         const session1Cells = rows.at(2)!.findAll("div.session-col-value");
-        expect(session1Cells.length).toBe(5);
+        expect(session1Cells.length).toBe(6);
         expect(session1Cells.at(0)!.text()).toBe("13/01/2022 09:26:36 (current session)");
         expect(session1Cells.at(1)!.text()).toBe("session1");
         expect(session1Cells.at(2)!.findComponent(VueFeather).props("type")).toBe("edit-2");
         const routerLink = session1Cells.at(3)!.findComponent(RouterLink);
         expect(routerLink.props("to")).toBe("/");
-        expect(session1Cells.at(4)!.find("span.session-copy-link").text()).toBe("Copy link");
-        expect(session1Cells.at(4)!.find("span.session-copy-link").findComponent(VueFeather).props("type"))
+        expect(session1Cells.at(4)!.findComponent(VueFeather).props("type")).toBe("trash-2");
+        expect(session1Cells.at(5)!.find("span.session-copy-link").text()).toBe("Copy link");
+        expect(session1Cells.at(5)!.find("span.session-copy-link").findComponent(VueFeather).props("type"))
             .toBe("copy");
-        expect(session1Cells.at(4)!.find("span.session-copy-code").text()).toBe("Copy code");
-        expect(session1Cells.at(4)!.find("span.session-copy-code").findComponent(VueFeather).props("type"))
+        expect(session1Cells.at(5)!.find("span.session-copy-code").text()).toBe("Copy code");
+        expect(session1Cells.at(5)!.find("span.session-copy-code").findComponent(VueFeather).props("type"))
             .toBe("copy");
-        expect(session1Cells.at(4)!.find(".session-copy-confirm").text()).toBe("");
+        expect(session1Cells.at(5)!.find(".session-copy-confirm").text()).toBe("");
 
         const session2Cells = rows.at(3)!.findAll("div.session-col-value");
-        expect(session1Cells.length).toBe(5);
+        expect(session1Cells.length).toBe(6);
         expect(session2Cells.at(0)!.text()).toBe("13/01/2022 10:26:36");
         expect(session2Cells.at(1)!.text()).toBe("--no label--");
         expect(session2Cells.at(2)!.findComponent(VueFeather).props("type")).toBe("edit-2");
         expect(session2Cells.at(3)!.find("a").attributes("href"))
             .toBe("http://localhost:3000/apps/testApp/?sessionId=def");
         expect(session2Cells.at(3)!.find("a").findComponent(VueFeather).props("type")).toBe("upload");
-        expect(session2Cells.at(4)!.find("span.session-copy-link").text()).toBe("Copy link");
-        expect(session2Cells.at(4)!.find("span.session-copy-code").text()).toBe("Copy code");
-        expect(session2Cells.at(4)!.find(".session-copy-confirm").text()).toBe("");
+        expect(session2Cells.at(4)!.findComponent(VueFeather).props("type")).toBe("trash-2");
+        expect(session2Cells.at(5)!.find("span.session-copy-link").text()).toBe("Copy link");
+        expect(session2Cells.at(5)!.find("span.session-copy-code").text()).toBe("Copy code");
+        expect(session2Cells.at(5)!.find(".session-copy-confirm").text()).toBe("");
 
         const editDlg = wrapper.findComponent(EditSessionLabel);
         expect(editDlg.props("open")).toBe(false);
@@ -109,6 +115,9 @@ describe("SessionsPage", () => {
         expect(editDlg.props("sessionLabel")).toBe(null);
 
         expect(wrapper.findComponent(ErrorsAlert).exists()).toBe(true);
+        expect(wrapper.findComponent(ConfirmModal).props("open")).toBe(false);
+        expect(wrapper.findComponent(ConfirmModal).props("title")).toBe("Delete session");
+        expect(wrapper.findComponent(ConfirmModal).props("text")).toBe("Do you want to delete this session?");
     });
 
     it("shows loading message when session metadata is null in store", () => {
@@ -149,11 +158,11 @@ describe("SessionsPage", () => {
         const rows = wrapper.findAll(".container .row");
         // session 1 already has a friendly id so action should not be dispatched
         const session1Cells = rows.at(2)!.findAll("div.session-col-value");
-        await session1Cells.at(4)!.find(".session-copy-link").trigger("click");
+        await session1Cells.at(5)!.find(".session-copy-link").trigger("click");
         expect(mockGenerateFriendlyId).not.toHaveBeenCalled();
         // session 2 has no friendly id so action should be dispatched
         const session2Cells = rows.at(3)!.findAll("div.session-col-value");
-        await session2Cells.at(4)!.find(".session-copy-link").trigger("click");
+        await session2Cells.at(5)!.find(".session-copy-link").trigger("click");
         expect(mockGenerateFriendlyId).toHaveBeenCalledTimes(1);
         expect(mockGenerateFriendlyId.mock.calls[0][1]).toBe("def");
     });
@@ -163,11 +172,11 @@ describe("SessionsPage", () => {
         const rows = wrapper.findAll(".container .row");
         // session 1 already has a friendly id so action should not be dispatched
         const session1Cells = rows.at(2)!.findAll("div.session-col-value");
-        await session1Cells.at(4)!.find(".session-copy-code").trigger("click");
+        await session1Cells.at(5)!.find(".session-copy-code").trigger("click");
         expect(mockGenerateFriendlyId).not.toHaveBeenCalled();
         // session 2 has no friendly id so action should be dispatched
         const session2Cells = rows.at(3)!.findAll("div.session-col-value");
-        await session2Cells.at(4)!.find(".session-copy-code").trigger("click");
+        await session2Cells.at(5)!.find(".session-copy-code").trigger("click");
         expect(mockGenerateFriendlyId).toHaveBeenCalledTimes(1);
         expect(mockGenerateFriendlyId.mock.calls[0][1]).toBe("def");
     });
@@ -176,14 +185,14 @@ describe("SessionsPage", () => {
         const wrapper = getWrapper(sessionsMetadata);
         const rows = wrapper.findAll(".container .row");
         const session1Cells = rows.at(2)!.findAll("div.session-col-value");
-        await session1Cells.at(4)!.find(".session-copy-link").trigger("click");
+        await session1Cells.at(5)!.find(".session-copy-link").trigger("click");
 
         const expectedLink = "http://localhost:3000/apps/testApp/?share=bad-cat";
 
         expect(mockClipboardWriteText).toHaveBeenCalledTimes(1);
         expect(mockClipboardWriteText.mock.calls[0][0]).toBe(expectedLink);
 
-        expect(session1Cells.at(4)!.find(".session-copy-confirm").text())
+        expect(session1Cells.at(5)!.find(".session-copy-confirm").text())
             .toBe(`Copied: ${expectedLink}`);
     });
 
@@ -191,12 +200,12 @@ describe("SessionsPage", () => {
         const wrapper = getWrapper(sessionsMetadata);
         const rows = wrapper.findAll(".container .row");
         const session1Cells = rows.at(2)!.findAll("div.session-col-value");
-        await session1Cells.at(4)!.find(".session-copy-code").trigger("click");
+        await session1Cells.at(5)!.find(".session-copy-code").trigger("click");
 
         expect(mockClipboardWriteText).toHaveBeenCalledTimes(1);
         expect(mockClipboardWriteText.mock.calls[0][0]).toBe("bad-cat");
 
-        expect(session1Cells.at(4)!.find(".session-copy-confirm").text())
+        expect(session1Cells.at(5)!.find(".session-copy-confirm").text())
             .toBe("Copied: bad-cat");
     });
 
@@ -204,11 +213,11 @@ describe("SessionsPage", () => {
         const wrapper = getWrapper(sessionsMetadata);
         const rows = wrapper.findAll(".container .row");
         const session1Cells = rows.at(2)!.findAll("div.session-col-value");
-        await session1Cells.at(4)!.find(".session-copy-code").trigger("click");
-        expect(session1Cells.at(4)!.find(".session-copy-confirm").text()).toBe("Copied: bad-cat");
+        await session1Cells.at(5)!.find(".session-copy-code").trigger("click");
+        expect(session1Cells.at(5)!.find(".session-copy-confirm").text()).toBe("Copied: bad-cat");
 
-        await session1Cells.at(4)!.find(".session-copy-code").trigger("mouseleave");
-        expect(session1Cells.at(4)!.find(".session-copy-confirm").text()).toBe("");
+        await session1Cells.at(5)!.find(".session-copy-code").trigger("mouseleave");
+        expect(session1Cells.at(5)!.find(".session-copy-confirm").text()).toBe("");
     });
 
     it("copy confirmation indicates if friendly id is being fetched, and could not be generated", (done) => {
@@ -218,9 +227,9 @@ describe("SessionsPage", () => {
             const wrapper = getWrapper(sessionsMetadata);
             const rows = wrapper.findAll(".container .row");
             const session2Cells = rows.at(3)!.findAll("div.session-col-value");
-            await session2Cells.at(4)!.find(".session-copy-code").trigger("click");
+            await session2Cells.at(5)!.find(".session-copy-code").trigger("click");
             // message will update to 'Fetching code...' while it calls the action
-            const confirm = session2Cells.at(4)!.find(".session-copy-confirm");
+            const confirm = session2Cells.at(5)!.find(".session-copy-confirm");
             expect(confirm.text()).toBe("Fetching code...");
 
             // when action is completed, id has not been successfully updated
@@ -231,4 +240,26 @@ describe("SessionsPage", () => {
         };
         runAsync();
     });
+
+    it("opens and closes confirm delete dialog", async () => {
+        const wrapper = getWrapper(sessionsMetadata);
+        const rows = wrapper.findAll(".container .row");
+        const session1Cells = rows.at(2)!.findAll("div.session-col-value");
+        await session1Cells.at(4)!.findComponent(VueFeather).trigger("click");
+        const confirm = wrapper.findComponent(ConfirmModal);
+        expect(confirm.props("open")).toBe(true);
+        await confirm.vm.$emit("close");
+        expect(confirm.props("open")).toBe(false);
+    });
+
+    it("deletes session on confirm", async () => {
+        const wrapper = getWrapper(sessionsMetadata);
+        const rows = wrapper.findAll(".container .row");
+        const session1Cells = rows.at(2)!.findAll("div.session-col-value");
+        await session1Cells.at(4)!.findComponent(VueFeather).trigger("click"); // set session to delete
+        const confirm = wrapper.findComponent(ConfirmModal);
+        await confirm.vm.$emit("confirm");
+        expect(mockDeleteSession).toHaveBeenCalledTimes(1);
+        expect(mockDeleteSession.mock.calls[0][1]).toBe("abc");
+    });
 });

From 3ead32fae2c7d0c2b698c82c07c7cde08f3db1b4 Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Wed, 6 Sep 2023 15:13:24 +0100
Subject: [PATCH 03/18] store tests

---
 app/static/src/app/components/ConfirmModal.vue   | 16 ++++++++--------
 .../src/app/components/sessions/SessionsPage.vue | 12 ++++++------
 .../tests/unit/localStorageManager.test.ts       |  8 ++++++++
 .../tests/unit/store/sessions/actions.test.ts    | 10 ++++++++++
 .../tests/unit/store/sessions/mutations.test.ts  | 14 ++++++++++++++
 5 files changed, 46 insertions(+), 14 deletions(-)

diff --git a/app/static/src/app/components/ConfirmModal.vue b/app/static/src/app/components/ConfirmModal.vue
index 39a2136b1..8b04d0691 100644
--- a/app/static/src/app/components/ConfirmModal.vue
+++ b/app/static/src/app/components/ConfirmModal.vue
@@ -25,26 +25,26 @@
 </template>
 
 <script setup lang="ts">
-import {computed} from "vue";
+import { computed, defineProps, defineEmits } from "vue";
 
 const props = defineProps({
-  open: Boolean,
-  title: String,
-  text: String
+    open: Boolean,
+    title: String,
+    text: String
 });
 
 const emit = defineEmits(["close", "confirm"]);
 
 const modalStyle = computed(() => {
-  return { display: props.open ? "block" : "none" };
+    return { display: props.open ? "block" : "none" };
 });
 
 const close = () => {
-  emit("close");
+    emit("close");
 };
 
 const confirm = () => {
-  emit("confirm");
-  close();
+    emit("confirm");
+    close();
 };
 </script>
diff --git a/app/static/src/app/components/sessions/SessionsPage.vue b/app/static/src/app/components/sessions/SessionsPage.vue
index 11cce8949..d764ab69f 100644
--- a/app/static/src/app/components/sessions/SessionsPage.vue
+++ b/app/static/src/app/components/sessions/SessionsPage.vue
@@ -192,16 +192,16 @@ export default defineComponent({
 
         const confirmDeleteSessionOpen = ref(false);
         const toggleConfirmDeleteSessionOpen = (open: boolean) => {
-          confirmDeleteSessionOpen.value = open;
-        }
+            confirmDeleteSessionOpen.value = open;
+        };
         const confirmDeleteSession = (sessionId: string) => {
-          sessionIdToDelete.value = sessionId;
-          toggleConfirmDeleteSessionOpen(true);
+            sessionIdToDelete.value = sessionId;
+            toggleConfirmDeleteSessionOpen(true);
         };
 
         const deleteSession = () => {
-          store.dispatch(`${namespace}/${SessionsAction.DeleteSession}`, sessionIdToDelete.value);
-        }
+            store.dispatch(`${namespace}/${SessionsAction.DeleteSession}`, sessionIdToDelete.value);
+        };
 
         onMounted(() => {
             store.dispatch(`${namespace}/${SessionsAction.GetSessions}`);
diff --git a/app/static/tests/unit/localStorageManager.test.ts b/app/static/tests/unit/localStorageManager.test.ts
index 9da5d2818..906bf20cb 100644
--- a/app/static/tests/unit/localStorageManager.test.ts
+++ b/app/static/tests/unit/localStorageManager.test.ts
@@ -37,4 +37,12 @@ describe("localStorageManager", () => {
         expect(spyOnSetItem.mock.calls[0][0]).toBe("testInstance_day1_sessionIds");
         expect(spyOnSetItem.mock.calls[0][1]).toBe(JSON.stringify(["session3", "session1", "session2"]));
     });
+
+    it("can delete session id", () => {
+        localStorageManager.deleteSessionId("day1", "testInstance", "session2");
+        expect(spyOnGetItem).toHaveBeenCalledTimes(1);
+        expect(spyOnSetItem).toHaveBeenCalledTimes(1);
+        expect(spyOnSetItem.mock.calls[0][0]).toBe("testInstance_day1_sessionIds");
+        expect(spyOnSetItem.mock.calls[0][1]).toBe(JSON.stringify(["session1"]));
+    });
 });
diff --git a/app/static/tests/unit/store/sessions/actions.test.ts b/app/static/tests/unit/store/sessions/actions.test.ts
index 3f8bfa7c4..e339509f1 100644
--- a/app/static/tests/unit/store/sessions/actions.test.ts
+++ b/app/static/tests/unit/store/sessions/actions.test.ts
@@ -14,6 +14,7 @@ import { AppStateGetter } from "../../../../src/app/store/appState/getters";
 describe("SessionsActions", () => {
     const getSessionIdsSpy = jest.spyOn(localStorageManager, "getSessionIds")
         .mockReturnValue(["123", "456"]);
+    const deleteSessionIdSpy = jest.spyOn(localStorageManager, "deleteSessionId");
 
     afterEach(() => {
         jest.clearAllTimers();
@@ -314,4 +315,13 @@ describe("SessionsActions", () => {
         expect(commit.mock.calls[0][1].detail).toBe("Test Error");
         expect(commit.mock.calls[0][2]).toStrictEqual({ root: true });
     });
+
+    it("DeleteSession removes from local storage and commits remove session id", async () => {
+        const commit = jest.fn();
+        const rootState = { appName: "testApp" };
+        await (actions[SessionsAction.DeleteSession] as any)({ commit, rootState, rootGetters }, "testSessionId");
+        expect(deleteSessionIdSpy).toHaveBeenCalledWith("testApp", "testInstance", "testSessionId");
+        expect(commit).toHaveBeenCalledTimes(1);
+        expect(commit).toHaveBeenCalledWith(SessionsMutation.RemoveSessionId, "testSessionId");
+    });
 });
diff --git a/app/static/tests/unit/store/sessions/mutations.test.ts b/app/static/tests/unit/store/sessions/mutations.test.ts
index f5f09753e..f8532e4de 100644
--- a/app/static/tests/unit/store/sessions/mutations.test.ts
+++ b/app/static/tests/unit/store/sessions/mutations.test.ts
@@ -43,4 +43,18 @@ describe("Sessions mutations", () => {
         mutations[SessionsMutation.SetSessionFriendlyId](state, payload);
         expect(state.sessionsMetadata).toStrictEqual(sessionsMetadata);
     });
+
+    it("RemoveSessionId removes session metadata from state", () => {
+        const sessionsMetadata = [
+            { id: "123" },
+            { id: "456" },
+            { id: "789" }
+        ];
+        const state = { sessionsMetadata } as any;
+        mutations[SessionsMutation.RemoveSessionId](state, "456");
+        expect(state.sessionsMetadata).toStrictEqual([
+            { id: "123" },
+            { id: "789" }
+        ]);
+    });
 });

From c5328cfe07ee81a589524e8594ca5e3e1d4df642 Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Wed, 6 Sep 2023 16:09:12 +0100
Subject: [PATCH 04/18] e2e test

---
 app/static/tests/e2e/sessions.etest.ts | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/app/static/tests/e2e/sessions.etest.ts b/app/static/tests/e2e/sessions.etest.ts
index 7bcbf4203..00ab20574 100644
--- a/app/static/tests/e2e/sessions.etest.ts
+++ b/app/static/tests/e2e/sessions.etest.ts
@@ -83,7 +83,8 @@ test.describe("Sessions tests", () => {
         await expect(await page.innerText(":nth-match(.session-col-header, 2)")).toBe("Label");
         await expect(await page.innerText(":nth-match(.session-col-header, 3)")).toBe("Edit Label");
         await expect(await page.innerText(":nth-match(.session-col-header, 4)")).toBe("Load");
-        await expect(await page.innerText(":nth-match(.session-col-header, 5)")).toBe("Shareable Link");
+        await expect(await page.innerText(":nth-match(.session-col-header, 5)")).toBe("Delete");
+        await expect(await page.innerText(":nth-match(.session-col-header, 6)")).toBe("Shareable Link");
 
         await expect(await page.innerText(".session-label")).toBe("--no label--");
 
@@ -185,6 +186,19 @@ test.describe("Sessions tests", () => {
         await page.goto(copiedLinkText);
         await expect(await page.innerText("#data-upload-success")).toBe(" Uploaded 32 rows and 2 columns");
 
+        // can delete session
+        await page.goto(`${appUrl}/sessions`);
+        const row = await page.locator(":nth-match(#app .container .row, 3)");
+        await row.locator(".session-edit-label i").click();
+        await enterSessionLabel(page, "page-edit-session-label", "delete me");
+        await expect(await row.locator(".session-label")).toHaveText(
+            "delete me", { timeout }
+        );
+        await row.locator(".session-delete i").click();
+        await expect(await page.locator("#confirm-yes")).toBeVisible();
+        await page.click("#confirm-yes");
+        await expect(await page.locator("#app")).not.toHaveText("delete me");
+
         await browser.close();
     });
 });

From 2c486a3147e21323b8c44fe5f24f16b3a407042c Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Wed, 6 Sep 2023 16:19:55 +0100
Subject: [PATCH 05/18] no delete of current session

---
 app/static/src/app/components/sessions/SessionsPage.vue  | 3 ++-
 .../tests/unit/components/sessions/sessionsPage.test.ts  | 9 +++++----
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/app/static/src/app/components/sessions/SessionsPage.vue b/app/static/src/app/components/sessions/SessionsPage.vue
index d764ab69f..308b21fa4 100644
--- a/app/static/src/app/components/sessions/SessionsPage.vue
+++ b/app/static/src/app/components/sessions/SessionsPage.vue
@@ -36,7 +36,8 @@
             </a>
           </div>
           <div class="col-1 text-center session-col-value session-delete">
-            <vue-feather class="inline-icon brand clickable"
+            <vue-feather v-if="!isCurrentSession(session.id)"
+                         class="inline-icon brand clickable"
                          type="trash-2"
                          @click="confirmDeleteSession(session.id)"></vue-feather>
           </div>
diff --git a/app/static/tests/unit/components/sessions/sessionsPage.test.ts b/app/static/tests/unit/components/sessions/sessionsPage.test.ts
index 8191aacd2..b08af336a 100644
--- a/app/static/tests/unit/components/sessions/sessionsPage.test.ts
+++ b/app/static/tests/unit/components/sessions/sessionsPage.test.ts
@@ -87,7 +87,8 @@ describe("SessionsPage", () => {
         expect(session1Cells.at(2)!.findComponent(VueFeather).props("type")).toBe("edit-2");
         const routerLink = session1Cells.at(3)!.findComponent(RouterLink);
         expect(routerLink.props("to")).toBe("/");
-        expect(session1Cells.at(4)!.findComponent(VueFeather).props("type")).toBe("trash-2");
+        // No delete control for current session
+        expect(session1Cells.at(4)!.findComponent(VueFeather).exists()).toBe(false);
         expect(session1Cells.at(5)!.find("span.session-copy-link").text()).toBe("Copy link");
         expect(session1Cells.at(5)!.find("span.session-copy-link").findComponent(VueFeather).props("type"))
             .toBe("copy");
@@ -244,7 +245,7 @@ describe("SessionsPage", () => {
     it("opens and closes confirm delete dialog", async () => {
         const wrapper = getWrapper(sessionsMetadata);
         const rows = wrapper.findAll(".container .row");
-        const session1Cells = rows.at(2)!.findAll("div.session-col-value");
+        const session1Cells = rows.at(3)!.findAll("div.session-col-value");
         await session1Cells.at(4)!.findComponent(VueFeather).trigger("click");
         const confirm = wrapper.findComponent(ConfirmModal);
         expect(confirm.props("open")).toBe(true);
@@ -255,11 +256,11 @@ describe("SessionsPage", () => {
     it("deletes session on confirm", async () => {
         const wrapper = getWrapper(sessionsMetadata);
         const rows = wrapper.findAll(".container .row");
-        const session1Cells = rows.at(2)!.findAll("div.session-col-value");
+        const session1Cells = rows.at(3)!.findAll("div.session-col-value");
         await session1Cells.at(4)!.findComponent(VueFeather).trigger("click"); // set session to delete
         const confirm = wrapper.findComponent(ConfirmModal);
         await confirm.vm.$emit("confirm");
         expect(mockDeleteSession).toHaveBeenCalledTimes(1);
-        expect(mockDeleteSession.mock.calls[0][1]).toBe("abc");
+        expect(mockDeleteSession.mock.calls[0][1]).toBe("def");
     });
 });

From 3d6dddc3d52d8eeda937c5a8b6c11e9337f499cf Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Wed, 6 Sep 2023 16:49:56 +0100
Subject: [PATCH 06/18] expect at least 2 session in e2e test

---
 app/static/tests/e2e/sessions.etest.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/app/static/tests/e2e/sessions.etest.ts b/app/static/tests/e2e/sessions.etest.ts
index 00ab20574..7ccf980cc 100644
--- a/app/static/tests/e2e/sessions.etest.ts
+++ b/app/static/tests/e2e/sessions.etest.ts
@@ -188,6 +188,7 @@ test.describe("Sessions tests", () => {
 
         // can delete session
         await page.goto(`${appUrl}/sessions`);
+        await expect(await page.locator("#app .container .row").count).toBeGreaterThan(2);
         const row = await page.locator(":nth-match(#app .container .row, 3)");
         await row.locator(".session-edit-label i").click();
         await enterSessionLabel(page, "page-edit-session-label", "delete me");

From c21421d1d7ad9e5defa84587584603331cbee344 Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Wed, 6 Sep 2023 16:53:44 +0100
Subject: [PATCH 07/18] fix

---
 app/static/tests/e2e/sessions.etest.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/static/tests/e2e/sessions.etest.ts b/app/static/tests/e2e/sessions.etest.ts
index 7ccf980cc..654f44d6e 100644
--- a/app/static/tests/e2e/sessions.etest.ts
+++ b/app/static/tests/e2e/sessions.etest.ts
@@ -23,7 +23,7 @@ const enterSessionLabel = async (page: Page, dialogId: string, newLabel: string)
 test.describe("Sessions tests", () => {
     const { timeout } = PlaywrightConfig;
 
-    test("can navigate to Sessions page from navbar, and load a session", async () => {
+    test("can use Sessions page", async () => {
         // We need to use a browser with persistent context instead of the default incognito browser so that
         // we can use the session ids in local storage
         const userDataDir = os.tmpdir();
@@ -188,7 +188,7 @@ test.describe("Sessions tests", () => {
 
         // can delete session
         await page.goto(`${appUrl}/sessions`);
-        await expect(await page.locator("#app .container .row").count).toBeGreaterThan(2);
+        await expect(await page.locator("#app .container .row").count()).toBeGreaterThan(2);
         const row = await page.locator(":nth-match(#app .container .row, 3)");
         await row.locator(".session-edit-label i").click();
         await enterSessionLabel(page, "page-edit-session-label", "delete me");

From 89528c3fb80fd263e50bf5bc7ec599080338c1fb Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Wed, 6 Sep 2023 17:40:04 +0100
Subject: [PATCH 08/18] debug

---
 app/static/tests/e2e/sessions.etest.ts | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/app/static/tests/e2e/sessions.etest.ts b/app/static/tests/e2e/sessions.etest.ts
index 654f44d6e..fb76b81ff 100644
--- a/app/static/tests/e2e/sessions.etest.ts
+++ b/app/static/tests/e2e/sessions.etest.ts
@@ -24,6 +24,7 @@ test.describe("Sessions tests", () => {
     const { timeout } = PlaywrightConfig;
 
     test("can use Sessions page", async () => {
+        console.log("0")
         // We need to use a browser with persistent context instead of the default incognito browser so that
         // we can use the session ids in local storage
         const userDataDir = os.tmpdir();
@@ -187,19 +188,31 @@ test.describe("Sessions tests", () => {
         await expect(await page.innerText("#data-upload-success")).toBe(" Uploaded 32 rows and 2 columns");
 
         // can delete session
+        console.log("1")
         await page.goto(`${appUrl}/sessions`);
+        console.log("2")
         await expect(await page.locator("#app .container .row").count()).toBeGreaterThan(2);
+        console.log("3")
         const row = await page.locator(":nth-match(#app .container .row, 3)");
+        console.log("4")
         await row.locator(".session-edit-label i").click();
+        console.log("5")
         await enterSessionLabel(page, "page-edit-session-label", "delete me");
+        console.log("6")
         await expect(await row.locator(".session-label")).toHaveText(
             "delete me", { timeout }
         );
+        console.log("7")
         await row.locator(".session-delete i").click();
+        console.log("8")
         await expect(await page.locator("#confirm-yes")).toBeVisible();
+        console.log("9")
         await page.click("#confirm-yes");
+        console.log("10")
         await expect(await page.locator("#app")).not.toHaveText("delete me");
+        console.log("11")
 
         await browser.close();
+        console.log("12")
     });
 });

From 401d3ce6139d213b78a7a7390e1f00ea60d3046f Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Wed, 6 Sep 2023 20:16:58 +0100
Subject: [PATCH 09/18] do not run tests in parallel

---
 app/static/playwright.config.ts | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/app/static/playwright.config.ts b/app/static/playwright.config.ts
index ff73bf2b3..131facb7e 100644
--- a/app/static/playwright.config.ts
+++ b/app/static/playwright.config.ts
@@ -2,8 +2,7 @@ import type { PlaywrightTestConfig } from "@playwright/test";
 
 const config: PlaywrightTestConfig = {
     testMatch: "*.etest.ts",
-    fullyParallel: true,
-    workers: process.env.CI ? 2 : undefined,
+    workers: 1,
     use: {
         baseURL: "http://localhost:3000",
         screenshot: "only-on-failure",

From 65148ecd84e4a7fe048b1376a7b36b1a340d33f3 Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Wed, 6 Sep 2023 21:29:21 +0100
Subject: [PATCH 10/18] save test results

---
 buildkite/pipeline.yml | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/buildkite/pipeline.yml b/buildkite/pipeline.yml
index 9826f85b8..040243bcf 100644
--- a/buildkite/pipeline.yml
+++ b/buildkite/pipeline.yml
@@ -6,6 +6,8 @@ steps:
 
   - label: ":playwright::chrome: Browser tests"
     command: docker/browser_tests
+    artifact_paths:
+      - "app/static/test-results/**/*"
 
   - wait
 

From 4135d1126e602058150937d4e97e1d409eb43d28 Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Wed, 6 Sep 2023 23:35:33 +0100
Subject: [PATCH 11/18] add extra session in e2e

---
 app/static/tests/e2e/sessions.etest.ts | 2 ++
 buildkite/pipeline.yml                 | 2 --
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/static/tests/e2e/sessions.etest.ts b/app/static/tests/e2e/sessions.etest.ts
index fb76b81ff..ae02e46dc 100644
--- a/app/static/tests/e2e/sessions.etest.ts
+++ b/app/static/tests/e2e/sessions.etest.ts
@@ -187,6 +187,8 @@ test.describe("Sessions tests", () => {
         await page.goto(copiedLinkText);
         await expect(await page.innerText("#data-upload-success")).toBe(" Uploaded 32 rows and 2 columns");
 
+        // force another session to be created
+        await page.goto(appUrl);
         // can delete session
         console.log("1")
         await page.goto(`${appUrl}/sessions`);
diff --git a/buildkite/pipeline.yml b/buildkite/pipeline.yml
index 040243bcf..9826f85b8 100644
--- a/buildkite/pipeline.yml
+++ b/buildkite/pipeline.yml
@@ -6,8 +6,6 @@ steps:
 
   - label: ":playwright::chrome: Browser tests"
     command: docker/browser_tests
-    artifact_paths:
-      - "app/static/test-results/**/*"
 
   - wait
 

From 5950cca1944782b54f71a2b791e2154ca33aa51d Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Wed, 6 Sep 2023 23:38:08 +0100
Subject: [PATCH 12/18] make sure app loaded

---
 app/static/tests/e2e/sessions.etest.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/app/static/tests/e2e/sessions.etest.ts b/app/static/tests/e2e/sessions.etest.ts
index ae02e46dc..8297f6ea0 100644
--- a/app/static/tests/e2e/sessions.etest.ts
+++ b/app/static/tests/e2e/sessions.etest.ts
@@ -189,6 +189,8 @@ test.describe("Sessions tests", () => {
 
         // force another session to be created
         await page.goto(appUrl);
+        await page.click(":nth-match(.wodin-left .nav-tabs a, 2)");
+
         // can delete session
         console.log("1")
         await page.goto(`${appUrl}/sessions`);

From 9b61bee1442f511e4d55a4dcb45904f0ba318bda Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Thu, 7 Sep 2023 00:05:44 +0100
Subject: [PATCH 13/18] use second available session

---
 app/static/tests/e2e/sessions.etest.ts | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/static/tests/e2e/sessions.etest.ts b/app/static/tests/e2e/sessions.etest.ts
index 8297f6ea0..9147f44a6 100644
--- a/app/static/tests/e2e/sessions.etest.ts
+++ b/app/static/tests/e2e/sessions.etest.ts
@@ -197,13 +197,13 @@ test.describe("Sessions tests", () => {
         console.log("2")
         await expect(await page.locator("#app .container .row").count()).toBeGreaterThan(2);
         console.log("3")
-        const row = await page.locator(":nth-match(#app .container .row, 3)");
+        const row = await page.locator(":nth-match(#app .container .row, 4)");
         console.log("4")
         await row.locator(".session-edit-label i").click();
         console.log("5")
         await enterSessionLabel(page, "page-edit-session-label", "delete me");
         console.log("6")
-        await expect(await row.locator(".session-label")).toHaveText(
+        await expect(await page.locator("#app")).toContainText(
             "delete me", { timeout }
         );
         console.log("7")
@@ -213,7 +213,7 @@ test.describe("Sessions tests", () => {
         console.log("9")
         await page.click("#confirm-yes");
         console.log("10")
-        await expect(await page.locator("#app")).not.toHaveText("delete me");
+        await expect(await page.locator("#app")).not.toContainText("delete me");
         console.log("11")
 
         await browser.close();

From 091ddf0e55ae1d089e2280bbc0cd5962fd65c43e Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Thu, 7 Sep 2023 00:23:07 +0100
Subject: [PATCH 14/18] reselect row

---
 app/static/tests/e2e/sessions.etest.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/static/tests/e2e/sessions.etest.ts b/app/static/tests/e2e/sessions.etest.ts
index 9147f44a6..80a5c344d 100644
--- a/app/static/tests/e2e/sessions.etest.ts
+++ b/app/static/tests/e2e/sessions.etest.ts
@@ -207,7 +207,7 @@ test.describe("Sessions tests", () => {
             "delete me", { timeout }
         );
         console.log("7")
-        await row.locator(".session-delete i").click();
+        await page.locator(":nth-match(#app .container .row, 4) .session-delete i").click();
         console.log("8")
         await expect(await page.locator("#confirm-yes")).toBeVisible();
         console.log("9")

From 0bd004123c7713a1a7d3ca0127ccb1ebcbe124b0 Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Thu, 7 Sep 2023 07:20:21 +0100
Subject: [PATCH 15/18] select row by text

---
 app/static/tests/e2e/sessions.etest.ts | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/app/static/tests/e2e/sessions.etest.ts b/app/static/tests/e2e/sessions.etest.ts
index 80a5c344d..332c6610b 100644
--- a/app/static/tests/e2e/sessions.etest.ts
+++ b/app/static/tests/e2e/sessions.etest.ts
@@ -202,12 +202,11 @@ test.describe("Sessions tests", () => {
         await row.locator(".session-edit-label i").click();
         console.log("5")
         await enterSessionLabel(page, "page-edit-session-label", "delete me");
+
         console.log("6")
-        await expect(await page.locator("#app")).toContainText(
-            "delete me", { timeout }
-        );
+        await expect( await page.locator(".row:has-text('delete me')")).toBeVisible({timeout});
         console.log("7")
-        await page.locator(":nth-match(#app .container .row, 4) .session-delete i").click();
+        await page.locator(".row:has-text('delete me') .session-delete i").click();
         console.log("8")
         await expect(await page.locator("#confirm-yes")).toBeVisible();
         console.log("9")

From 77e8168c5ed7c124f01e5bf44ec65dccfd927bd4 Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Thu, 7 Sep 2023 09:30:12 +0100
Subject: [PATCH 16/18] see if we can do without additional session

---
 app/static/tests/e2e/sessions.etest.ts | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/app/static/tests/e2e/sessions.etest.ts b/app/static/tests/e2e/sessions.etest.ts
index 332c6610b..ed3c54aa3 100644
--- a/app/static/tests/e2e/sessions.etest.ts
+++ b/app/static/tests/e2e/sessions.etest.ts
@@ -188,18 +188,18 @@ test.describe("Sessions tests", () => {
         await expect(await page.innerText("#data-upload-success")).toBe(" Uploaded 32 rows and 2 columns");
 
         // force another session to be created
-        await page.goto(appUrl);
-        await page.click(":nth-match(.wodin-left .nav-tabs a, 2)");
+        //await page.goto(appUrl);
+        //await page.click(":nth-match(.wodin-left .nav-tabs a, 2)");
 
         // can delete session
         console.log("1")
         await page.goto(`${appUrl}/sessions`);
         console.log("2")
-        await expect(await page.locator("#app .container .row").count()).toBeGreaterThan(2);
+        await expect(await page.locator("#app .container .row").count()).toBeGreaterThan(3);
         console.log("3")
-        const row = await page.locator(":nth-match(#app .container .row, 4)");
+        //const row = await page.locator(":nth-match(#app .container .row, 4)");
         console.log("4")
-        await row.locator(".session-edit-label i").click();
+        await page.locator(":nth-match(#app .container .row, 4) .session-edit-label i").click();
         console.log("5")
         await enterSessionLabel(page, "page-edit-session-label", "delete me");
 

From 1f431794d429a0b51235024748dc34171837e9ef Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Thu, 7 Sep 2023 10:09:09 +0100
Subject: [PATCH 17/18] see if we can restore parallel

---
 app/static/playwright.config.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/app/static/playwright.config.ts b/app/static/playwright.config.ts
index 131facb7e..ff73bf2b3 100644
--- a/app/static/playwright.config.ts
+++ b/app/static/playwright.config.ts
@@ -2,7 +2,8 @@ import type { PlaywrightTestConfig } from "@playwright/test";
 
 const config: PlaywrightTestConfig = {
     testMatch: "*.etest.ts",
-    workers: 1,
+    fullyParallel: true,
+    workers: process.env.CI ? 2 : undefined,
     use: {
         baseURL: "http://localhost:3000",
         screenshot: "only-on-failure",

From bd98068f2f0c1ec0eb64c81dcc767956c68beee0 Mon Sep 17 00:00:00 2001
From: EmmaLRussell <EmmaRussellKilburn@gmail.com>
Date: Thu, 7 Sep 2023 10:27:45 +0100
Subject: [PATCH 18/18] remove debug

---
 app/static/tests/e2e/sessions.etest.ts | 20 +-------------------
 1 file changed, 1 insertion(+), 19 deletions(-)

diff --git a/app/static/tests/e2e/sessions.etest.ts b/app/static/tests/e2e/sessions.etest.ts
index ed3c54aa3..e4a9631c9 100644
--- a/app/static/tests/e2e/sessions.etest.ts
+++ b/app/static/tests/e2e/sessions.etest.ts
@@ -24,7 +24,6 @@ test.describe("Sessions tests", () => {
     const { timeout } = PlaywrightConfig;
 
     test("can use Sessions page", async () => {
-        console.log("0")
         // We need to use a browser with persistent context instead of the default incognito browser so that
         // we can use the session ids in local storage
         const userDataDir = os.tmpdir();
@@ -187,35 +186,18 @@ test.describe("Sessions tests", () => {
         await page.goto(copiedLinkText);
         await expect(await page.innerText("#data-upload-success")).toBe(" Uploaded 32 rows and 2 columns");
 
-        // force another session to be created
-        //await page.goto(appUrl);
-        //await page.click(":nth-match(.wodin-left .nav-tabs a, 2)");
-
         // can delete session
-        console.log("1")
         await page.goto(`${appUrl}/sessions`);
-        console.log("2")
         await expect(await page.locator("#app .container .row").count()).toBeGreaterThan(3);
-        console.log("3")
-        //const row = await page.locator(":nth-match(#app .container .row, 4)");
-        console.log("4")
         await page.locator(":nth-match(#app .container .row, 4) .session-edit-label i").click();
-        console.log("5")
         await enterSessionLabel(page, "page-edit-session-label", "delete me");
 
-        console.log("6")
-        await expect( await page.locator(".row:has-text('delete me')")).toBeVisible({timeout});
-        console.log("7")
+        await expect(await page.locator(".row:has-text('delete me')")).toBeVisible({ timeout });
         await page.locator(".row:has-text('delete me') .session-delete i").click();
-        console.log("8")
         await expect(await page.locator("#confirm-yes")).toBeVisible();
-        console.log("9")
         await page.click("#confirm-yes");
-        console.log("10")
         await expect(await page.locator("#app")).not.toContainText("delete me");
-        console.log("11")
 
         await browser.close();
-        console.log("12")
     });
 });