Add test for trying to delete a project when there is a test suite

cypress/e2e/admin/project_settings.cy.ts

@@ -512,11 +512,12 @@ describe('project settings page as admin', () => {
       .url().should('eq', projects_tab_url)
   })
 
-  it.skip('shows project deletion related API errors', function() {
-    // TODO: create test suite
-    // TODO: create test case
-    cy.visit(this.page_uri).get_by_testid('show-delete-project-modal-button').click()
+  it('shows project deletion related API errors', function() {
+    cy.create_test_suite(this.project_pk, "Sweet suite")
+      .visit(this.page_uri).get_by_testid('show-delete-project-modal-button').click()
       .get_by_testid('delete-project-button').click()
       .get_api_errors().first().should('contain.text', 'test case')
+      .get_by_testid('cancel-delete-project-button').click()
+      .save_and_reload()
   })
 })

cypress/support/e2e.ts

@@ -14,7 +14,11 @@
 // ***********************************************************
 
 import {
+  AGTestCase,
+  AGTestSuite,
   Course,
+  NewAGTestCaseData,
+  NewAGTestSuiteData,
   NewCourseData,
   NewProjectData,
   Semester,
@@ -43,6 +47,22 @@ declare global {
        */
       create_project(course_pk: number, project_name: string): Chainable
 
+      /**
+       * Create a test suite by making a POST request to the API. Yields the primary
+       * key of the new test suite.
+       * @param {number} course_pk The primary key of the course to make the project under
+       * @param {string} test_suite_name The name of the project to be made
+       */
+      create_test_suite(course_pk: number, test_suite_name: string): Chainable
+
+      /**
+       * Create a test case by making a POST request to the API. Yields the primary
+       * key of the new test suite.
+       * @param {number} test_suite_pk The primary key of the course to make the project under
+       * @param {string} test_case_name The name of the project to be made
+       */
+      create_test_case(test_suite_pk: number, test_case_name: string): Chainable
+
       /**
        * Log a user in by setting the necessary session cookies.
        * This command assumes the backend is running with "fake" auth
@@ -62,7 +82,7 @@ declare global {
 
       /**
        * Save the current page and refresh. Fails if there are any API errors
-       * on the page (data-testid=api-error)
+       * on the page (data-testid=api-error) after saving or after reloading.
        */
       save_and_reload(): Chainable
 
@@ -87,7 +107,8 @@ Cypress.Commands.add('save', () => {
 })
 
 Cypress.Commands.add('save_and_reload', () => {
-  cy.save().get_api_errors().should('have.length', 0).reload();
+  cy.save().get_api_errors().should('have.length', 0)
+    .reload().get_api_errors().should('have.length', 0);
 })
 
 Cypress.Commands.add('fake_login', username => {
@@ -145,11 +166,41 @@ Cypress.Commands.add('create_project', (course_pk, project_name) => {
       return new Cypress.Promise<Project>(async (resolve, _) => {
         const project = await Project.create(course_pk, new NewProjectData({
             name: project_name
-        }))
+        }));
         resolve(project);
       })
     })
     .then(project => {
       return cy.wrap(project.pk);
     })
 })
+
+Cypress.Commands.add('create_test_suite', (project_pk, test_suite_name) => {
+  cy.fake_login(admin)
+    .then(() => {
+      return new Cypress.Promise<AGTestSuite>(async (resolve, _) => {
+        const suite = await AGTestSuite.create(project_pk, new NewAGTestSuiteData({
+          name: test_suite_name
+        }));
+        resolve(suite);
+      })
+    })
+    .then(suite => {
+      return cy.wrap(suite.pk);
+    })
+})
+
+Cypress.Commands.add('create_test_case', (test_suite_pk, test_case_name) => {
+  cy.fake_login(admin)
+    .then(() => {
+      return new Cypress.Promise<AGTestCase>(async (resolve, _) => {
+        const test_case = await AGTestCase.create(test_suite_pk, new NewAGTestCaseData({
+          name: test_case_name
+        }));
+        resolve(test_case);
+      })
+    })
+    .then(test_case => {
+      return cy.wrap(test_case.pk);
+    })
+})

src/components/project_admin/project_settings.vue

@@ -444,6 +444,7 @@
                     @click="delete_project"> Delete </button>
 
             <button class="modal-cancel-button white-button"
+                    data-testid="cancel-delete-project-button"
                     @click="d_show_delete_project_modal = false">
               Cancel
             </button>