Add latest changes from gitlab-org/gitlab@master

5 files changed, 75 insertions, 100 deletions

diff --git a/spec/frontend/vue_shared/components/user_avatar/user_avatar_image_new_spec.js b/spec/frontend/vue_shared/components/user_avatar/user_avatar_image_new_spec.js
index 5e05b54cb8c..f87737ca86a 100644
--- a/spec/frontend/vue_shared/components/user_avatar/user_avatar_image_new_spec.js
+++ b/spec/frontend/vue_shared/components/user_avatar/user_avatar_image_new_spec.js
@@ -18,6 +18,8 @@ const PROVIDED_PROPS = {
 describe('User Avatar Image Component', () => {
   let wrapper;
 
+  const findAvatar = () => wrapper.findComponent(GlAvatar);
+
   afterEach(() => {
     wrapper.destroy();
   });
@@ -28,21 +30,14 @@ describe('User Avatar Image Component', () => {
         propsData: {
           ...PROVIDED_PROPS,
         },
-        provide: {
-          glFeatures: {
-            glAvatarForAllUserAvatars: true,
-          },
-        },
       });
     });
 
     it('should render `GlAvatar` and provide correct properties to it', () => {
-      const avatar = wrapper.findComponent(GlAvatar);
-
-      expect(avatar.attributes('data-src')).toBe(
+      expect(findAvatar().attributes('data-src')).toBe(
         `${PROVIDED_PROPS.imgSrc}?width=${PROVIDED_PROPS.size}`,
       );
-      expect(avatar.props()).toMatchObject({
+      expect(findAvatar().props()).toMatchObject({
         src: `${PROVIDED_PROPS.imgSrc}?width=${PROVIDED_PROPS.size}`,
         alt: PROVIDED_PROPS.imgAlt,
         size: PROVIDED_PROPS.size,
@@ -63,23 +58,28 @@ describe('User Avatar Image Component', () => {
           ...PROVIDED_PROPS,
           lazy: true,
         },
-        provide: {
-          glFeatures: {
-            glAvatarForAllUserAvatars: true,
-          },
-        },
       });
     });
 
     it('should add lazy attributes', () => {
-      const avatar = wrapper.findComponent(GlAvatar);
-
-      expect(avatar.classes()).toContain('lazy');
-      expect(avatar.attributes()).toMatchObject({
+      expect(findAvatar().classes()).toContain('lazy');
+      expect(findAvatar().attributes()).toMatchObject({
         src: placeholderImage,
         'data-src': `${PROVIDED_PROPS.imgSrc}?width=${PROVIDED_PROPS.size}`,
       });
     });
+
+    it('should use maximum number when size is provided as an object', () => {
+      wrapper = shallowMount(UserAvatarImage, {
+        propsData: {
+          ...PROVIDED_PROPS,
+          size: { default: 16, md: 64, lg: 24 },
+          lazy: true,
+        },
+      });
+
+      expect(findAvatar().attributes('data-src')).toBe(`${PROVIDED_PROPS.imgSrc}?width=${64}`);
+    });
   });
 
   describe('Initialization without src', () => {
@@ -89,18 +89,11 @@ describe('User Avatar Image Component', () => {
           ...PROVIDED_PROPS,
           imgSrc: null,
         },
-        provide: {
-          glFeatures: {
-            glAvatarForAllUserAvatars: true,
-          },
-        },
       });
     });
 
     it('should have default avatar image', () => {
-      const avatar = wrapper.findComponent(GlAvatar);
-
-      expect(avatar.props('src')).toBe(`${defaultAvatarUrl}?width=${PROVIDED_PROPS.size}`);
+      expect(findAvatar().props('src')).toBe(`${defaultAvatarUrl}?width=${PROVIDED_PROPS.size}`);
     });
   });
 
diff --git a/spec/frontend/vue_shared/components/user_avatar/user_avatar_image_spec.js b/spec/frontend/vue_shared/components/user_avatar/user_avatar_image_spec.js
index 75d2a936b34..6ad2ef226c2 100644
--- a/spec/frontend/vue_shared/components/user_avatar/user_avatar_image_spec.js
+++ b/spec/frontend/vue_shared/components/user_avatar/user_avatar_image_spec.js
@@ -15,47 +15,37 @@ const PROVIDED_PROPS = {
 describe('User Avatar Image Component', () => {
   let wrapper;
 
-  afterEach(() => {
-    wrapper.destroy();
-  });
-
-  describe('when `glAvatarForAllUserAvatars` feature flag enabled', () => {
-    beforeEach(() => {
-      wrapper = shallowMount(UserAvatarImage, {
-        propsData: {
-          ...PROVIDED_PROPS,
+  const createWrapper = (props = {}, { glAvatarForAllUserAvatars } = {}) => {
+    wrapper = shallowMount(UserAvatarImage, {
+      propsData: {
+        ...PROVIDED_PROPS,
+        ...props,
+      },
+      provide: {
+        glFeatures: {
+          glAvatarForAllUserAvatars,
         },
-        provide: {
-          glFeatures: {
-            glAvatarForAllUserAvatars: true,
-          },
-        },
-      });
+      },
     });
+  };
 
-    it('should render `UserAvatarImageNew` component', () => {
-      expect(wrapper.findComponent(UserAvatarImageNew).exists()).toBe(true);
-      expect(wrapper.findComponent(UserAvatarImageOld).exists()).toBe(false);
-    });
+  afterEach(() => {
+    wrapper.destroy();
   });
 
-  describe('when `glAvatarForAllUserAvatars` feature flag disabled', () => {
-    beforeEach(() => {
-      wrapper = shallowMount(UserAvatarImage, {
-        propsData: {
-          ...PROVIDED_PROPS,
-        },
-        provide: {
-          glFeatures: {
-            glAvatarForAllUserAvatars: false,
-          },
-        },
+  describe.each([
+    [false, true, true],
+    [true, false, true],
+    [true, true, true],
+    [false, false, false],
+  ])(
+    'when glAvatarForAllUserAvatars=%s and enforceGlAvatar=%s',
+    (glAvatarForAllUserAvatars, enforceGlAvatar, isUsingNewVersion) => {
+      it(`will render ${isUsingNewVersion ? 'new' : 'old'} version`, () => {
+        createWrapper({ enforceGlAvatar }, { glAvatarForAllUserAvatars });
+        expect(wrapper.findComponent(UserAvatarImageNew).exists()).toBe(isUsingNewVersion);
+        expect(wrapper.findComponent(UserAvatarImageOld).exists()).toBe(!isUsingNewVersion);
       });
-    });
-
-    it('should render `UserAvatarImageOld` component', () => {
-      expect(wrapper.findComponent(UserAvatarImageNew).exists()).toBe(false);
-      expect(wrapper.findComponent(UserAvatarImageOld).exists()).toBe(true);
-    });
-  });
+    },
+  );
 });
diff --git a/spec/frontend/vue_shared/components/user_avatar/user_avatar_link_new_spec.js b/spec/frontend/vue_shared/components/user_avatar/user_avatar_link_new_spec.js
index 5ba80b31b99..f485a14cfea 100644
--- a/spec/frontend/vue_shared/components/user_avatar/user_avatar_link_new_spec.js
+++ b/spec/frontend/vue_shared/components/user_avatar/user_avatar_link_new_spec.js
@@ -54,6 +54,7 @@ describe('User Avatar Link Component', () => {
       size: defaultProps.imgSize,
       tooltipPlacement: defaultProps.tooltipPlacement,
       tooltipText: '',
+      enforceGlAvatar: false,
     });
   });
 
diff --git a/spec/frontend/vue_shared/components/user_avatar/user_avatar_link_old_spec.js b/spec/frontend/vue_shared/components/user_avatar/user_avatar_link_old_spec.js
index 2d513c46e77..cf7a1025dba 100644
--- a/spec/frontend/vue_shared/components/user_avatar/user_avatar_link_old_spec.js
+++ b/spec/frontend/vue_shared/components/user_avatar/user_avatar_link_old_spec.js
@@ -54,6 +54,7 @@ describe('User Avatar Link Component', () => {
       size: defaultProps.imgSize,
       tooltipPlacement: defaultProps.tooltipPlacement,
       tooltipText: '',
+      enforceGlAvatar: false,
     });
   });
 
diff --git a/spec/frontend/vue_shared/components/user_avatar/user_avatar_link_spec.js b/spec/frontend/vue_shared/components/user_avatar/user_avatar_link_spec.js
index b36b83d1fea..fd3f59008ec 100644
--- a/spec/frontend/vue_shared/components/user_avatar/user_avatar_link_spec.js
+++ b/spec/frontend/vue_shared/components/user_avatar/user_avatar_link_spec.js
@@ -15,47 +15,37 @@ const PROVIDED_PROPS = {
 describe('User Avatar Link Component', () => {
   let wrapper;
 
-  afterEach(() => {
-    wrapper.destroy();
-  });
-
-  describe('when `glAvatarForAllUserAvatars` feature flag enabled', () => {
-    beforeEach(() => {
-      wrapper = shallowMount(UserAvatarLink, {
-        propsData: {
-          ...PROVIDED_PROPS,
+  const createWrapper = (props = {}, { glAvatarForAllUserAvatars } = {}) => {
+    wrapper = shallowMount(UserAvatarLink, {
+      propsData: {
+        ...PROVIDED_PROPS,
+        ...props,
+      },
+      provide: {
+        glFeatures: {
+          glAvatarForAllUserAvatars,
         },
-        provide: {
-          glFeatures: {
-            glAvatarForAllUserAvatars: true,
-          },
-        },
-      });
+      },
     });
+  };
 
-    it('should render `UserAvatarLinkNew` component', () => {
-      expect(wrapper.findComponent(UserAvatarLinkNew).exists()).toBe(true);
-      expect(wrapper.findComponent(UserAvatarLinkOld).exists()).toBe(false);
-    });
+  afterEach(() => {
+    wrapper.destroy();
   });
 
-  describe('when `glAvatarForAllUserAvatars` feature flag disabled', () => {
-    beforeEach(() => {
-      wrapper = shallowMount(UserAvatarLink, {
-        propsData: {
-          ...PROVIDED_PROPS,
-        },
-        provide: {
-          glFeatures: {
-            glAvatarForAllUserAvatars: false,
-          },
-        },
+  describe.each([
+    [false, true, true],
+    [true, false, true],
+    [true, true, true],
+    [false, false, false],
+  ])(
+    'when glAvatarForAllUserAvatars=%s and enforceGlAvatar=%s',
+    (glAvatarForAllUserAvatars, enforceGlAvatar, isUsingNewVersion) => {
+      it(`will render ${isUsingNewVersion ? 'new' : 'old'} version`, () => {
+        createWrapper({ enforceGlAvatar }, { glAvatarForAllUserAvatars });
+        expect(wrapper.findComponent(UserAvatarLinkNew).exists()).toBe(isUsingNewVersion);
+        expect(wrapper.findComponent(UserAvatarLinkOld).exists()).toBe(!isUsingNewVersion);
       });
-    });
-
-    it('should render `UserAvatarLinkOld` component', () => {
-      expect(wrapper.findComponent(UserAvatarLinkNew).exists()).toBe(false);
-      expect(wrapper.findComponent(UserAvatarLinkOld).exists()).toBe(true);
-    });
-  });
+    },
+  );
 });