test(api/client): empty string in about settings (#55700)

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>

api-server/src/server/boot/settings.js

@@ -170,7 +170,7 @@ function updateMyProfileUI(req, res, next) {
   );
 }
 
-function updateMyAbout(req, res, next) {
+export function updateMyAbout(req, res, next) {
   const {
     user,
     body: { name, location, about, picture }

api-server/src/server/boot_tests/settings.test.js

@@ -1,4 +1,8 @@
-import { updateMySocials, updateMyClassroomMode } from '../boot/settings';
+import {
+  updateMyAbout,
+  updateMySocials,
+  updateMyClassroomMode
+} from '../boot/settings';
 
 export const mockReq = opts => {
   const req = {};
@@ -17,6 +21,36 @@ export const mockRes = opts => {
 };
 
 describe('boot/settings', () => {
+  describe('updateMyAbout', () => {
+    it('allows empty string in any field', () => {
+      let updateData;
+      const req = mockReq({
+        user: {
+          updateAttributes: (update, cb) => {
+            updateData = update;
+            cb();
+          }
+        },
+        body: {
+          name: '',
+          location: '',
+          about: '',
+          picture: ''
+        }
+      });
+      const res = mockRes();
+      const next = jest.fn();
+      updateMyAbout(req, res, next);
+      expect(res.status).toHaveBeenCalledWith(200);
+      expect(updateData).toStrictEqual({
+        name: '',
+        location: '',
+        about: '',
+        picture: ''
+      });
+    });
+  });
+
   describe('updateMySocials', () => {
     it('does not allow non-github domain in GitHub social', () => {
       const req = mockReq({

api/src/routes/settings.test.ts

@@ -922,6 +922,43 @@ Happy coding!
         });
         expect(response.statusCode).toEqual(200);
       });
+
+      test('PUT with empty strings clears the values in about settings ', async () => {
+        const initialResponse = await superPut('/update-my-about').send({
+          about: 'Teacher at freeCodeCamp',
+          name: 'Quincy Larson',
+          location: 'USA',
+          picture:
+            'https://cdn.freecodecamp.org/platform/english/images/quincy-larson-signature.svg'
+        });
+
+        expect(initialResponse.body).toEqual({
+          message: 'flash.updated-about-me',
+          type: 'success'
+        });
+        expect(initialResponse.statusCode).toEqual(200);
+
+        const response = await superPut('/update-my-about').send({
+          about: '',
+          name: '',
+          location: '',
+          picture: ''
+        });
+
+        expect(response.body).toEqual({
+          message: 'flash.updated-about-me',
+          type: 'success'
+        });
+        expect(response.statusCode).toEqual(200);
+
+        const user = await fastifyTestInstance?.prisma.user.findFirst({
+          where: { email: 'foo@bar.com' }
+        });
+        expect(user?.about).toEqual('');
+        expect(user?.name).toEqual('');
+        expect(user?.location).toEqual('');
+        expect(user?.picture).toEqual('');
+      });
     });
 
     describe('/update-my-honesty', () => {

e2e/settings.spec.ts

@@ -300,4 +300,52 @@ test.describe('Settings', () => {
       })
     ).toBeVisible();
   });
+
+  test('Should allow empty string in any field in about settings', async ({
+    page
+  }) => {
+    const saveButton = page.getByRole('button', {
+      name: translations.settings.headings['personal-info']
+    });
+
+    const nameInput = page.getByLabel(translations.settings.labels.name, {
+      exact: true
+    });
+    const locationInput = page.getByLabel(
+      translations.settings.labels.location
+    );
+    const pictureInput = page.getByLabel(translations.settings.labels.picture);
+    const aboutInput = page.getByLabel(translations.settings.labels.about);
+
+    await nameInput.fill('Quincy Larson');
+    await locationInput.fill('USA');
+    await pictureInput.fill(
+      'https://cdn.freecodecamp.org/platform/english/images/quincy-larson-signature.svg'
+    );
+    await aboutInput.fill('Teacher at freeCodeCamp');
+
+    await expect(saveButton).not.toBeDisabled();
+    await saveButton.click();
+    await expect(
+      page.getByText(translations.flash['updated-about-me'])
+    ).toBeVisible();
+
+    await nameInput.fill('');
+    await locationInput.fill('');
+    await pictureInput.fill('');
+    await aboutInput.fill('');
+
+    await expect(saveButton).not.toBeDisabled();
+    await saveButton.click();
+    await expect(
+      page.getByText(translations.flash['updated-about-me'])
+    ).toBeVisible();
+
+    await page.reload();
+
+    await expect(nameInput).toHaveValue('');
+    await expect(locationInput).toHaveValue('');
+    await expect(pictureInput).toHaveValue('');
+    await expect(aboutInput).toHaveValue('');
+  });
 });