1 files changed, 60 insertions, 2 deletions
diff --git a/spec/frontend/runner/graphql/local_state_spec.js b/spec/frontend/runner/graphql/local_state_spec.js
index 5c4302e4aa2..ae874fef00d 100644
--- a/spec/frontend/runner/graphql/local_state_spec.js
+++ b/spec/frontend/runner/graphql/local_state_spec.js
@@ -1,6 +1,8 @@
+import { gql } from '@apollo/client/core';
 import createApolloClient from '~/lib/graphql';
 import { createLocalState } from '~/runner/graphql/list/local_state';
 import getCheckedRunnerIdsQuery from '~/runner/graphql/list/checked_runner_ids.query.graphql';
+import { RUNNER_TYPENAME } from '~/runner/constants';
 
 describe('~/runner/graphql/list/local_state', () => {
   let localState;
@@ -18,6 +20,21 @@ describe('~/runner/graphql/list/local_state', () => {
     apolloClient = createApolloClient({}, { cacheConfig, typeDefs });
   };
 
+  const addMockRunnerToCache = (id) => {
+    // mock some runners in the cache to prevent dangling references
+    apolloClient.writeFragment({
+      id: `${RUNNER_TYPENAME}:${id}`,
+      fragment: gql`
+        fragment DummyRunner on CiRunner {
+          __typename
+        }
+      `,
+      data: {
+        __typename: RUNNER_TYPENAME,
+      },
+    });
+  };
+
   const queryCheckedRunnerIds = () => {
     const { checkedRunnerIds } = apolloClient.readQuery({
       query: getCheckedRunnerIdsQuery,
@@ -34,10 +51,25 @@ describe('~/runner/graphql/list/local_state', () => {
     apolloClient = null;
   });
 
-  describe('default', () => {
-    it('has empty checked list', () => {
+  describe('queryCheckedRunnerIds', () => {
+    it('has empty checked list by default', () => {
       expect(queryCheckedRunnerIds()).toEqual([]);
     });
+
+    it('returns checked runners that have a reference in the cache', () => {
+      addMockRunnerToCache('a');
+      localState.localMutations.setRunnerChecked({ runner: { id: 'a' }, isChecked: true });
+
+      expect(queryCheckedRunnerIds()).toEqual(['a']);
+    });
+
+    it('return checked runners that are not dangling references', () => {
+      addMockRunnerToCache('a'); // 'b' is missing from the cache, perhaps because it was deleted
+      localState.localMutations.setRunnerChecked({ runner: { id: 'a' }, isChecked: true });
+      localState.localMutations.setRunnerChecked({ runner: { id: 'b' }, isChecked: true });
+
+      expect(queryCheckedRunnerIds()).toEqual(['a']);
+    });
   });
 
   describe.each`
@@ -48,6 +80,7 @@ describe('~/runner/graphql/list/local_state', () => {
   `('setRunnerChecked', ({ inputs, expected }) => {
     beforeEach(() => {
       inputs.forEach(([id, isChecked]) => {
+        addMockRunnerToCache(id);
         localState.localMutations.setRunnerChecked({ runner: { id }, isChecked });
       });
     });
@@ -56,9 +89,34 @@ describe('~/runner/graphql/list/local_state', () => {
     });
   });
 
+  describe.each`
+    inputs                                       | expected
+    ${[[['a', 'b'], true]]}                      | ${['a', 'b']}
+    ${[[['a', 'b'], false]]}                     | ${[]}
+    ${[[['a', 'b'], true], [['c', 'd'], true]]}  | ${['a', 'b', 'c', 'd']}
+    ${[[['a', 'b'], true], [['a', 'b'], false]]} | ${[]}
+    ${[[['a', 'b'], true], [['b'], false]]}      | ${['a']}
+  `('setRunnersChecked', ({ inputs, expected }) => {
+    beforeEach(() => {
+      inputs.forEach(([ids, isChecked]) => {
+        ids.forEach(addMockRunnerToCache);
+
+        localState.localMutations.setRunnersChecked({
+          runners: ids.map((id) => ({ id })),
+          isChecked,
+        });
+      });
+    });
+
+    it(`for inputs="${inputs}" has a ids="[${expected}]"`, () => {
+      expect(queryCheckedRunnerIds()).toEqual(expected);
+    });
+  });
+
   describe('clearChecked', () => {
     it('clears all checked items', () => {
       ['a', 'b', 'c'].forEach((id) => {
+        addMockRunnerToCache(id);
         localState.localMutations.setRunnerChecked({ runner: { id }, isChecked: true });
       });