refactor: remove no longer needed icon Safari workaround

packages/icon/src/vaadin-icon-mixin.d.ts

@@ -5,15 +5,14 @@
  */
 import type { Constructor } from '@open-wc/dedupe-mixin';
 import type { SlotStylesMixinClass } from '@vaadin/component-base/src/slot-styles-mixin.js';
-import type { IconFontSizeMixinClass } from './vaadin-icon-font-size-mixin.js';
 import type { IconSvgLiteral } from './vaadin-icon-svg.js';
 
 /**
  * A mixin providing common icon functionality.
  */
 export declare function IconMixin<T extends Constructor<HTMLElement>>(
   base: T,
-): Constructor<IconFontSizeMixinClass> & Constructor<IconMixinClass> & Constructor<SlotStylesMixinClass> & T;
+): Constructor<IconMixinClass> & Constructor<SlotStylesMixinClass> & T;
 
 export declare class IconMixinClass {
   /**

packages/icon/src/vaadin-icon-mixin.js

@@ -5,7 +5,6 @@
  */
 import { SlotStylesMixin } from '@vaadin/component-base/src/slot-styles-mixin.js';
 import { TooltipController } from '@vaadin/component-base/src/tooltip-controller.js';
-import { IconFontSizeMixin } from './vaadin-icon-font-size-mixin.js';
 import { ensureSvgLiteral, renderSvg, unsafeSvgLiteral } from './vaadin-icon-svg.js';
 
 const srcCache = new Map();
@@ -15,10 +14,9 @@ const Iconset = customElements.get('vaadin-iconset');
 /**
  * @polymerMixin
  * @mixes SlotStylesMixin
- * @mixes IconFontSizeMixin
  */
 export const IconMixin = (superClass) =>
-  class extends IconFontSizeMixin(SlotStylesMixin(superClass)) {
+  class extends SlotStylesMixin(superClass) {
     static get properties() {
       return {
         /**

packages/icon/test/icon-font.test.js

@@ -1,7 +1,6 @@
 import { expect } from '@vaadin/chai-plugins';
-import { fixtureSync, isChrome, nextFrame, nextResize } from '@vaadin/testing-helpers';
+import { fixtureSync, nextFrame, nextResize } from '@vaadin/testing-helpers';
 import '../src/vaadin-icon.js';
-import { needsFontIconSizingFallback, supportsCQUnitsForPseudoElements } from '../src/vaadin-icon-helpers.js';
 import { iconFontCss } from './test-icon-font.js';
 
 describe('vaadin-icon - icon fonts', () => {
@@ -268,71 +267,4 @@ describe('vaadin-icon - icon fonts', () => {
       expect(['"My icons 6"', 'My icons 6']).to.include(fontIconStyle.fontFamily);
     });
   });
-
-  // These tests make sure that the heavy container query fallback is only used
-  // when font icons are used.
-  describe('container query fallback', () => {
-    // Tests for browsers that require the fallback
-    const fallBackIt = needsFontIconSizingFallback() ? it : it.skip;
-    // Tests for browsers that we know for sure not to require the fallback
-    const supportedIt = isChrome ? it : it.skip;
-
-    let icon;
-
-    supportedIt('should support CQ width units on pseudo elements', () => {
-      expect(supportsCQUnitsForPseudoElements()).to.be.true;
-    });
-
-    supportedIt('should not need the fallback', () => {
-      expect(needsFontIconSizingFallback()).to.be.false;
-    });
-
-    fallBackIt('should not support CQ width units on pseudo elements', () => {
-      expect(supportsCQUnitsForPseudoElements()).to.be.false;
-    });
-
-    fallBackIt('should have the custom property (iconClass)', async () => {
-      icon = fixtureSync('<vaadin-icon icon-class="foo"></vaadin-icon>');
-      await nextFrame();
-      expect(icon.style.getPropertyValue('--_vaadin-font-icon-size')).to.equal('24px');
-    });
-
-    fallBackIt('should have the custom property (char)', async () => {
-      icon = fixtureSync('<vaadin-icon char="foo"></vaadin-icon>');
-      await nextFrame();
-      expect(icon.style.getPropertyValue('--_vaadin-font-icon-size')).to.equal('24px');
-    });
-
-    fallBackIt('should not have the custom property', async () => {
-      icon = fixtureSync('<vaadin-icon></vaadin-icon>');
-      await nextFrame();
-      expect(icon.style.getPropertyValue('--_vaadin-font-icon-size')).to.equal('');
-    });
-
-    fallBackIt('should set the custom property', async () => {
-      icon = fixtureSync('<vaadin-icon></vaadin-icon>');
-      await nextFrame();
-      icon.iconClass = 'foo';
-      expect(icon.style.getPropertyValue('--_vaadin-font-icon-size')).to.equal('24px');
-    });
-
-    fallBackIt('should update the custom property', async () => {
-      icon = fixtureSync('<vaadin-icon icon-class="foo"></vaadin-icon>');
-      await nextFrame();
-      icon.style.width = '100px';
-      icon.style.height = '100px';
-      await nextResize(icon);
-      expect(icon.style.getPropertyValue('--_vaadin-font-icon-size')).to.equal('100px');
-    });
-
-    fallBackIt('should not update the custom property', async () => {
-      icon = fixtureSync('<vaadin-icon></vaadin-icon>');
-      await nextFrame();
-      icon.style.width = '100px';
-      icon.style.height = '100px';
-      await nextFrame(icon);
-      await nextFrame(icon);
-      expect(icon.style.getPropertyValue('--_vaadin-font-icon-size')).to.equal('');
-    });
-  });
 });