Add loader if channel is being published and community library side p…

contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/SubmitToCommunityLibrarySidePanel/__tests__/SubmitToCommunityLibrarySidePanel.spec.js

@@ -23,6 +23,10 @@ jest.mock('shared/data/resources', () => ({
   CommunityLibrarySubmission: {
     create: jest.fn(() => Promise.resolve()),
   },
+  Channel: {
+    fetchModel: jest.fn(),
+    getCatalogChannel: jest.fn(() => Promise.resolve()),
+  },
 }));
 
 const store = factory();
@@ -265,6 +269,54 @@ describe('SubmitToCommunityLibrarySidePanel', () => {
     });
   });
 
+  describe('publishing state', () => {
+    beforeEach(() => {
+      jest.useFakeTimers();
+    });
+    afterEach(() => {
+      jest.useRealTimers();
+    });
+
+    it('disables form and shows loader when channel is publishing', async () => {
+      const channel = { ...publishedNonPublicChannel, publishing: true };
+      const wrapper = await makeWrapper({ channel, publishedData, latestSubmission: null });
+
+      // Loader/message container should exist
+      expect(wrapper.find('.publishing-loader').exists()).toBe(true);
+
+      const descriptionTextbox = wrapper.findComponent('.description-textbox');
+      expect(descriptionTextbox.exists()).toBe(false);
+      const submitButton = wrapper.find('[data-test="submit-button"]');
+      expect(submitButton.exists()).toBe(false);
+    });
+
+    it('enables form after publishing flips to false (poll-driven)', async () => {
+      const { Channel } = require('shared/data/resources');
+      Channel.fetchModel.mockResolvedValue({
+        id: publishedNonPublicChannel.id,
+        publishing: false,
+        version: 3,
+      });
+
+      const channel = { ...publishedNonPublicChannel, publishing: true };
+      const wrapper = await makeWrapper({ channel, publishedData, latestSubmission: null });
+
+      const updatedChannel = { ...channel, publishing: false, version: 3 };
+      store.commit('channel/ADD_CHANNEL', updatedChannel);
+
+      await wrapper.vm.$nextTick();
+      await wrapper.vm.$nextTick();
+
+      const descriptionTextbox = wrapper.findComponent('.description-textbox');
+      expect(descriptionTextbox.props('disabled')).toBe(false);
+
+      await descriptionTextbox.vm.$emit('input', 'Some description');
+      await wrapper.vm.$nextTick();
+      const submitButton = wrapper.find('[data-test="submit-button"]');
+      expect(submitButton.attributes('disabled')).toBeUndefined();
+    });
+  });
+
   describe('show less button', () => {
     it('is displayed when additional info is shown', async () => {
       const wrapper = await makeWrapper({