@capillarytech/creatives-library 8.0.263 → 8.0.265

package/v2Containers/WebPush/Create/preview/components/tests/AndroidMobileExpanded.test.js

@@ -1,733 +0,0 @@
-import React from 'react';
-import { shallowWithIntl, mountWithIntl } from '../../../../../../helpers/intl-enzym-test-helpers';
-import AndroidMobileExpanded from '../AndroidMobileExpanded';
-
-describe('AndroidMobileExpanded', () => {
-  const defaultProps = {
-    icon: 'https://example.com/chrome-icon.png',
-    selectedBrowser: 'Chrome',
-    notificationTitle: 'Test Notification Title',
-    notificationBody: 'Test notification body text that can be quite long and should be truncated after 4 lines',
-    displayUrl: 'example.com',
-    brandIcon: 'https://example.com/brand-icon.png',
-    shouldShowBrandIcon: false,
-    shouldShowBrandIconExpanded: false,
-    mediaImageUrl: '',
-  };
-
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  describe('Basic Rendering', () => {
-    it('should render correctly with default props', () => {
-      const wrapper = shallowWithIntl(<AndroidMobileExpanded {...defaultProps} />);
-      expect(wrapper).toMatchSnapshot();
-    });
-
-    it('should render all required elements', () => {
-      const wrapper = mountWithIntl(<AndroidMobileExpanded {...defaultProps} />);
-      
-      // Browser icon container
-      expect(wrapper.find('.android-mobile-expanded-icon').exists()).toBe(true);
-      expect(wrapper.find('.notification-icon-container').exists()).toBe(true);
-      expect(wrapper.find('.notification-icon').exists()).toBe(true);
-      
-      // Wrapper container
-      expect(wrapper.find('.android-mobile-expanded-wrapper').exists()).toBe(true);
-      
-      // Top section
-      expect(wrapper.find('.android-mobile-expanded-top').exists()).toBe(true);
-      expect(wrapper.find('.android-mobile-expanded-top-content').exists()).toBe(true);
-      
-      // Header
-      expect(wrapper.find('.android-mobile-expanded-header').exists()).toBe(true);
-      expect(wrapper.find('.android-mobile-expanded-header-content').exists()).toBe(true);
-      expect(wrapper.find('.android-mobile-expanded-browser-name').exists()).toBe(true);
-      expect(wrapper.find('.android-mobile-expanded-domain-time').exists()).toBe(true);
-      expect(wrapper.find('.android-mobile-expanded-domain').exists()).toBe(true);
-      expect(wrapper.find('.android-mobile-expanded-time').exists()).toBe(true);
-      
-      // Title
-      expect(wrapper.find('.android-mobile-expanded-title').exists()).toBe(true);
-      
-      // Body
-      expect(wrapper.find('.android-mobile-expanded-body').exists()).toBe(true);
-      expect(wrapper.find('.android-mobile-expanded-body-text').exists()).toBe(true);
-      
-      // Arrow
-      expect(wrapper.find('.notification-action-arrow.android-mobile-expanded-arrow').exists()).toBe(true);
-    });
-
-    it('should render browser icon with correct src and alt', () => {
-      const wrapper = mountWithIntl(<AndroidMobileExpanded {...defaultProps} />);
-      const icon = wrapper.find('.notification-icon');
-      
-      expect(icon.exists()).toBe(true);
-      expect(icon.prop('src')).toBe(defaultProps.icon);
-      expect(icon.prop('alt')).toBe(defaultProps.selectedBrowser);
-    });
-
-    it('should render notification title', () => {
-      const wrapper = mountWithIntl(<AndroidMobileExpanded {...defaultProps} />);
-      const title = wrapper.find('.android-mobile-expanded-title');
-      
-      expect(title.exists()).toBe(true);
-      expect(title.text()).toBe(defaultProps.notificationTitle);
-    });
-
-    it('should render notification body', () => {
-      const wrapper = mountWithIntl(<AndroidMobileExpanded {...defaultProps} />);
-      const body = wrapper.find('.android-mobile-expanded-body-text');
-      
-      expect(body.exists()).toBe(true);
-      expect(body.text()).toBe(defaultProps.notificationBody);
-    });
-
-    it('should render display URL', () => {
-      const wrapper = mountWithIntl(<AndroidMobileExpanded {...defaultProps} />);
-      const domain = wrapper.find('.android-mobile-expanded-domain');
-      
-      expect(domain.exists()).toBe(true);
-      expect(domain.text()).toBe(defaultProps.displayUrl);
-    });
-
-    it('should render hardcoded time', () => {
-      const wrapper = mountWithIntl(<AndroidMobileExpanded {...defaultProps} />);
-      const time = wrapper.find('.android-mobile-expanded-time');
-      
-      expect(time.exists()).toBe(true);
-      expect(time.text()).toBe('2:29 PM');
-    });
-
-    it('should render arrow icon', () => {
-      const wrapper = mountWithIntl(<AndroidMobileExpanded {...defaultProps} />);
-      const arrow = wrapper.find('.notification-action-arrow.android-mobile-expanded-arrow');
-      const arrowIcon = wrapper.find('.android-mobile-expanded-arrow-icon');
-      
-      expect(arrow.exists()).toBe(true);
-      expect(arrowIcon.exists()).toBe(true);
-      expect(arrowIcon.prop('alt')).toBe('Collapse');
-    });
-  });
-
-  describe('getBrowserDisplayName', () => {
-    it('should return "Chrome" for Chrome browser', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded {...defaultProps} selectedBrowser="Chrome" />
-      );
-      const browserName = wrapper.find('.android-mobile-expanded-browser-name');
-      
-      expect(browserName.text()).toBe('Chrome');
-    });
-
-    it('should return "Firefox" for Firefox browser', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded {...defaultProps} selectedBrowser="Firefox" />
-      );
-      const browserName = wrapper.find('.android-mobile-expanded-browser-name');
-      
-      expect(browserName.text()).toBe('Firefox');
-    });
-
-    it('should return "Edge" for Edge browser', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded {...defaultProps} selectedBrowser="Edge" />
-      );
-      const browserName = wrapper.find('.android-mobile-expanded-browser-name');
-      
-      expect(browserName.text()).toBe('Edge');
-    });
-
-    it('should return "Opera" for Opera browser', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded {...defaultProps} selectedBrowser="Opera" />
-      );
-      const browserName = wrapper.find('.android-mobile-expanded-browser-name');
-      
-      expect(browserName.text()).toBe('Opera');
-    });
-
-    it('should return the browser name as-is for unknown browsers', () => {
-      const unknownBrowser = 'Safari';
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded {...defaultProps} selectedBrowser={unknownBrowser} />
-      );
-      const browserName = wrapper.find('.android-mobile-expanded-browser-name');
-      
-      expect(browserName.text()).toBe(unknownBrowser);
-    });
-
-    it('should handle empty string browser name', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded {...defaultProps} selectedBrowser="" />
-      );
-      const browserName = wrapper.find('.android-mobile-expanded-browser-name');
-      
-      expect(browserName.text()).toBe('');
-    });
-
-    it('should handle case-sensitive browser names', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded {...defaultProps} selectedBrowser="chrome" />
-      );
-      const browserName = wrapper.find('.android-mobile-expanded-browser-name');
-      
-      // Should return as-is since "chrome" (lowercase) is not in the mapping
-      expect(browserName.text()).toBe('chrome');
-    });
-  });
-
-  describe('Brand Icon Display Logic', () => {
-    it('should show brand icon when shouldShowBrandIconExpanded is true and brandIcon exists', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          shouldShowBrandIconExpanded={true}
-          brandIcon="https://example.com/brand-icon.png"
-        />
-      );
-      
-      const brandIconContainer = wrapper.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
-      expect(brandIconContainer.exists()).toBe(true);
-      
-      const brandIcon = wrapper.find('.notification-brand-icon');
-      expect(brandIcon.exists()).toBe(true);
-      expect(brandIcon.prop('src')).toBe('https://example.com/brand-icon.png');
-      expect(brandIcon.prop('alt')).toBe('Brand icon');
-    });
-
-    it('should show brand icon when shouldShowBrandIcon is true and brandIcon exists', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          shouldShowBrandIcon={true}
-          brandIcon="https://example.com/brand-icon.png"
-        />
-      );
-      
-      const brandIconContainer = wrapper.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
-      expect(brandIconContainer.exists()).toBe(true);
-      
-      const brandIcon = wrapper.find('.notification-brand-icon');
-      expect(brandIcon.exists()).toBe(true);
-      expect(brandIcon.prop('src')).toBe('https://example.com/brand-icon.png');
-    });
-
-    it('should show brand icon when both shouldShowBrandIcon and shouldShowBrandIconExpanded are true', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          shouldShowBrandIcon={true}
-          shouldShowBrandIconExpanded={true}
-          brandIcon="https://example.com/brand-icon.png"
-        />
-      );
-      
-      const brandIconContainer = wrapper.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
-      expect(brandIconContainer.exists()).toBe(true);
-    });
-
-    it('should not show brand icon when both shouldShowBrandIcon and shouldShowBrandIconExpanded are false', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          shouldShowBrandIcon={false}
-          shouldShowBrandIconExpanded={false}
-          brandIcon="https://example.com/brand-icon.png"
-        />
-      );
-      
-      const brandIconContainer = wrapper.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
-      expect(brandIconContainer.exists()).toBe(false);
-    });
-
-    it('should not show brand icon when brandIcon is not provided, even if shouldShowBrandIconExpanded is true', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          shouldShowBrandIconExpanded={true}
-          brandIcon=""
-        />
-      );
-      
-      const brandIconContainer = wrapper.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
-      expect(brandIconContainer.exists()).toBe(false);
-    });
-
-    it('should not show brand icon when brandIcon is not provided, even if shouldShowBrandIcon is true', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          shouldShowBrandIcon={true}
-          brandIcon={null}
-        />
-      );
-      
-      const brandIconContainer = wrapper.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
-      expect(brandIconContainer.exists()).toBe(false);
-    });
-
-    it('should not show brand icon when brandIcon is undefined', () => {
-      const propsWithoutBrandIcon = { ...defaultProps };
-      delete propsWithoutBrandIcon.brandIcon;
-      
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...propsWithoutBrandIcon}
-          shouldShowBrandIcon={true}
-          shouldShowBrandIconExpanded={true}
-        />
-      );
-      
-      const brandIconContainer = wrapper.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
-      expect(brandIconContainer.exists()).toBe(false);
-    });
-
-    it('should handle shouldShowBrandIconExpanded taking precedence when both flags are set', () => {
-      // When shouldShowBrandIconExpanded is true, it should show (OR logic)
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          shouldShowBrandIcon={false}
-          shouldShowBrandIconExpanded={true}
-          brandIcon="https://example.com/brand-icon.png"
-        />
-      );
-      
-      const brandIconContainer = wrapper.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
-      expect(brandIconContainer.exists()).toBe(true);
-    });
-  });
-
-  describe('Media Image Display', () => {
-    it('should render media image when mediaImageUrl is provided', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          mediaImageUrl="https://example.com/media-image.jpg"
-        />
-      );
-      
-      const mediaContainer = wrapper.find('.android-mobile-expanded-media');
-      expect(mediaContainer.exists()).toBe(true);
-      
-      const mediaImage = wrapper.find('.android-mobile-expanded-media-image');
-      expect(mediaImage.exists()).toBe(true);
-      expect(mediaImage.prop('src')).toBe('https://example.com/media-image.jpg');
-      expect(mediaImage.prop('alt')).toBe('Notification media');
-    });
-
-    it('should not render media image when mediaImageUrl is empty string', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          mediaImageUrl=""
-        />
-      );
-      
-      const mediaContainer = wrapper.find('.android-mobile-expanded-media');
-      expect(mediaContainer.exists()).toBe(false);
-    });
-
-    it('should not render media image when mediaImageUrl is not provided', () => {
-      const propsWithoutMedia = { ...defaultProps };
-      delete propsWithoutMedia.mediaImageUrl;
-      
-      const wrapper = mountWithIntl(<AndroidMobileExpanded {...propsWithoutMedia} />);
-      
-      const mediaContainer = wrapper.find('.android-mobile-expanded-media');
-      expect(mediaContainer.exists()).toBe(false);
-    });
-
-    it('should not render media image when mediaImageUrl is null', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          mediaImageUrl={null}
-        />
-      );
-      
-      const mediaContainer = wrapper.find('.android-mobile-expanded-media');
-      expect(mediaContainer.exists()).toBe(false);
-    });
-
-    it('should not render media image when mediaImageUrl is undefined', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          mediaImageUrl={undefined}
-        />
-      );
-      
-      const mediaContainer = wrapper.find('.android-mobile-expanded-media');
-      expect(mediaContainer.exists()).toBe(false);
-    });
-  });
-
-  describe('Edge Cases and Optional Props', () => {
-    it('should handle empty notification title', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded {...defaultProps} notificationTitle="" />
-      );
-      const title = wrapper.find('.android-mobile-expanded-title');
-      
-      expect(title.exists()).toBe(true);
-      expect(title.text()).toBe('');
-    });
-
-    it('should handle empty notification body', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded {...defaultProps} notificationBody="" />
-      );
-      const body = wrapper.find('.android-mobile-expanded-body-text');
-      
-      expect(body.exists()).toBe(true);
-      expect(body.text()).toBe('');
-    });
-
-    it('should handle empty display URL', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded {...defaultProps} displayUrl="" />
-      );
-      const domain = wrapper.find('.android-mobile-expanded-domain');
-      
-      expect(domain.exists()).toBe(true);
-      expect(domain.text()).toBe('');
-    });
-
-    it('should handle very long notification title', () => {
-      const longTitle = 'A'.repeat(200);
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded {...defaultProps} notificationTitle={longTitle} />
-      );
-      const title = wrapper.find('.android-mobile-expanded-title');
-      
-      expect(title.exists()).toBe(true);
-      expect(title.text()).toBe(longTitle);
-    });
-
-    it('should handle very long notification body', () => {
-      const longBody = 'B'.repeat(500);
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded {...defaultProps} notificationBody={longBody} />
-      );
-      const body = wrapper.find('.android-mobile-expanded-body-text');
-      
-      expect(body.exists()).toBe(true);
-      expect(body.text()).toBe(longBody);
-    });
-
-    it('should handle missing optional props gracefully', () => {
-      const minimalProps = {
-        icon: 'https://example.com/icon.png',
-        selectedBrowser: 'Chrome',
-      };
-      
-      const wrapper = mountWithIntl(<AndroidMobileExpanded {...minimalProps} />);
-      
-      // Should still render all structural elements
-      expect(wrapper.find('.android-mobile-expanded-wrapper').exists()).toBe(true);
-      expect(wrapper.find('.android-mobile-expanded-title').exists()).toBe(true);
-      expect(wrapper.find('.android-mobile-expanded-body-text').exists()).toBe(true);
-    });
-  });
-
-  describe('Component Structure', () => {
-    it('should have correct DOM hierarchy', () => {
-      const wrapper = mountWithIntl(<AndroidMobileExpanded {...defaultProps} />);
-      
-      // Icon should be sibling to wrapper
-      const icon = wrapper.find('.android-mobile-expanded-icon');
-      const wrapperDiv = wrapper.find('.android-mobile-expanded-wrapper');
-      const arrow = wrapper.find('.notification-action-arrow.android-mobile-expanded-arrow');
-      
-      expect(icon.exists()).toBe(true);
-      expect(wrapperDiv.exists()).toBe(true);
-      expect(arrow.exists()).toBe(true);
-      
-      // Top section should contain header and title
-      const topSection = wrapper.find('.android-mobile-expanded-top');
-      expect(topSection.find('.android-mobile-expanded-header').exists()).toBe(true);
-      expect(topSection.find('.android-mobile-expanded-title').exists()).toBe(true);
-      
-      // Body should contain body text
-      const bodySection = wrapper.find('.android-mobile-expanded-body');
-      expect(bodySection.find('.android-mobile-expanded-body-text').exists()).toBe(true);
-    });
-
-    it('should render brand icon in correct location when shown', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          shouldShowBrandIconExpanded={true}
-          brandIcon="https://example.com/brand-icon.png"
-        />
-      );
-      
-      // Brand icon should be in the top section
-      const topSection = wrapper.find('.android-mobile-expanded-top');
-      const brandIconContainer = topSection.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
-      
-      expect(brandIconContainer.exists()).toBe(true);
-    });
-
-    it('should render media image in body section when provided', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          mediaImageUrl="https://example.com/media.jpg"
-        />
-      );
-      
-      // Media should be in the body section
-      const bodySection = wrapper.find('.android-mobile-expanded-body');
-      const mediaContainer = bodySection.find('.android-mobile-expanded-media');
-      
-      expect(mediaContainer.exists()).toBe(true);
-    });
-  });
-
-  describe('CTA Buttons', () => {
-    it('should render CTA buttons when enableCtas is true and ctaButtons array has items', () => {
-      const ctaButtons = [
-        { id: '1', label: 'Button 1' },
-        { id: '2', label: 'Button 2' },
-      ];
-      
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          enableCtas={true}
-          ctaButtons={ctaButtons}
-        />
-      );
-      
-      const ctaContainer = wrapper.find('.android-mobile-expanded-cta-container');
-      expect(ctaContainer.exists()).toBe(true);
-      
-      const ctaButtonsElements = wrapper.find('.android-mobile-expanded-cta-button');
-      expect(ctaButtonsElements.length).toBe(2);
-      
-      expect(ctaButtonsElements.at(0).find('.android-mobile-expanded-cta-button-text').text()).toBe('Button 1');
-      expect(ctaButtonsElements.at(1).find('.android-mobile-expanded-cta-button-text').text()).toBe('Button 2');
-    });
-
-    it('should not render CTA buttons when enableCtas is false', () => {
-      const ctaButtons = [
-        { id: '1', label: 'Button 1' },
-      ];
-      
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          enableCtas={false}
-          ctaButtons={ctaButtons}
-        />
-      );
-      
-      const ctaContainer = wrapper.find('.android-mobile-expanded-cta-container');
-      expect(ctaContainer.exists()).toBe(false);
-    });
-
-    it('should not render CTA buttons when ctaButtons array is empty', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          enableCtas={true}
-          ctaButtons={[]}
-        />
-      );
-      
-      const ctaContainer = wrapper.find('.android-mobile-expanded-cta-container');
-      expect(ctaContainer.exists()).toBe(false);
-    });
-
-    it('should not render CTA buttons when ctaButtons is null', () => {
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          enableCtas={true}
-          ctaButtons={null}
-        />
-      );
-      
-      const ctaContainer = wrapper.find('.android-mobile-expanded-cta-container');
-      expect(ctaContainer.exists()).toBe(false);
-    });
-
-    it('should not render CTA buttons when ctaButtons is undefined', () => {
-      const propsWithoutCtas = { ...defaultProps };
-      delete propsWithoutCtas.ctaButtons;
-      
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...propsWithoutCtas}
-          enableCtas={true}
-        />
-      );
-      
-      const ctaContainer = wrapper.find('.android-mobile-expanded-cta-container');
-      expect(ctaContainer.exists()).toBe(false);
-    });
-
-    it('should apply single button class when only one CTA button is provided', () => {
-      const ctaButtons = [
-        { id: '1', label: 'Single Button' },
-      ];
-      
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          enableCtas={true}
-          ctaButtons={ctaButtons}
-        />
-      );
-      
-      const ctaButton = wrapper.find('.android-mobile-expanded-cta-button');
-      expect(ctaButton.hasClass('android-mobile-expanded-cta-button-single')).toBe(true);
-    });
-
-    it('should not apply single button class when multiple CTA buttons are provided', () => {
-      const ctaButtons = [
-        { id: '1', label: 'Button 1' },
-        { id: '2', label: 'Button 2' },
-      ];
-      
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          enableCtas={true}
-          ctaButtons={ctaButtons}
-        />
-      );
-      
-      const ctaButtonsElements = wrapper.find('.android-mobile-expanded-cta-button');
-      ctaButtonsElements.forEach((button) => {
-        expect(button.hasClass('android-mobile-expanded-cta-button-single')).toBe(false);
-      });
-    });
-
-    it('should render dividers between multiple CTA buttons', () => {
-      const ctaButtons = [
-        { id: '1', label: 'Button 1' },
-        { id: '2', label: 'Button 2' },
-        { id: '3', label: 'Button 3' },
-      ];
-      
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          enableCtas={true}
-          ctaButtons={ctaButtons}
-        />
-      );
-      
-      const dividers = wrapper.find('.android-mobile-expanded-cta-divider');
-      // Should have 2 dividers for 3 buttons (dividers appear between buttons, not before first)
-      expect(dividers.length).toBe(2);
-    });
-
-    it('should not render divider before first button', () => {
-      const ctaButtons = [
-        { id: '1', label: 'Button 1' },
-        { id: '2', label: 'Button 2' },
-      ];
-      
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          enableCtas={true}
-          ctaButtons={ctaButtons}
-        />
-      );
-      
-      const ctaContainer = wrapper.find('.android-mobile-expanded-cta-container');
-      const firstChild = ctaContainer.children().at(0);
-      
-      // First child should be a button, not a divider
-      expect(firstChild.hasClass('android-mobile-expanded-cta-button')).toBe(true);
-    });
-
-    it('should render CTA buttons with correct keys', () => {
-      const ctaButtons = [
-        { id: 'button-1', label: 'Button 1' },
-        { id: 'button-2', label: 'Button 2' },
-      ];
-      
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          enableCtas={true}
-          ctaButtons={ctaButtons}
-        />
-      );
-      
-      const ctaButtonsElements = wrapper.find('.android-mobile-expanded-cta-button');
-      // React Fragment keys are not directly accessible, but we can verify buttons render correctly
-      expect(ctaButtonsElements.length).toBe(2);
-      expect(ctaButtonsElements.at(0).find('.android-mobile-expanded-cta-button-text').text()).toBe('Button 1');
-      expect(ctaButtonsElements.at(1).find('.android-mobile-expanded-cta-button-text').text()).toBe('Button 2');
-    });
-
-    it('should render CTA buttons with aria-label', () => {
-      const ctaButtons = [
-        { id: '1', label: 'Click Me' },
-      ];
-      
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          enableCtas={true}
-          ctaButtons={ctaButtons}
-        />
-      );
-      
-      const ctaButton = wrapper.find('.android-mobile-expanded-cta-button');
-      expect(ctaButton.prop('aria-label')).toBe('Click Me');
-    });
-
-    it('should handle CTA button with empty label', () => {
-      const ctaButtons = [
-        { id: '1', label: '' },
-      ];
-      
-      const wrapper = mountWithIntl(
-        <AndroidMobileExpanded
-          {...defaultProps}
-          enableCtas={true}
-          ctaButtons={ctaButtons}
-        />
-      );
-      
-      const ctaButton = wrapper.find('.android-mobile-expanded-cta-button');
-      expect(ctaButton.exists()).toBe(true);
-      expect(ctaButton.find('.android-mobile-expanded-cta-button-text').text()).toBe('');
-      expect(ctaButton.prop('aria-label')).toBe('');
-    });
-  });
-
-  describe('PropTypes Validation', () => {
-    it('should require icon prop', () => {
-      const propsWithoutIcon = { ...defaultProps };
-      delete propsWithoutIcon.icon;
-      
-      // PropTypes validation happens at runtime, but we can verify the component handles missing props
-      // In a real scenario, this would be caught by PropTypes in development mode
-      expect(() => {
-        mountWithIntl(<AndroidMobileExpanded {...propsWithoutIcon} />);
-      }).not.toThrow();
-    });
-
-    it('should require selectedBrowser prop', () => {
-      const propsWithoutBrowser = { ...defaultProps };
-      delete propsWithoutBrowser.selectedBrowser;
-      
-      // Component should still render, but PropTypes would warn in development
-      expect(() => {
-        mountWithIntl(<AndroidMobileExpanded {...propsWithoutBrowser} />);
-      }).not.toThrow();
-    });
-  });
-});
-