chore: postpone theme class attachments until first widget creation (DevExpress#29679)

Author: VasilyStrelyaev

apps/demos/testing/etalons/Charts-ClientSideDataProcessing (material.blue.light).png

@@ -2,13 +2,14 @@ import { getOuterHeight } from '../core/utils/size';
 import devices from '../core/devices';
 import domAdapter from '../core/dom_adapter';
 import $ from '../core/renderer';
-import { Deferred } from '../core/utils/deferred';
+import { Deferred, when } from '../core/utils/deferred';
 import { parseHTML } from '../core/utils/html_parser';
 import { each } from '../core/utils/iterator';
 import readyCallbacks from '../core/utils/ready_callbacks';
 import { value as viewPortValue, changeCallback, originalViewPort } from '../core/utils/view_port';
 import { getWindow, hasWindow } from '../core/utils/window';
 import { themeReadyCallback } from './themes_callback';
+import { uiLayerInitialized } from '../__internal/core/utils/m_common';
 import errors from './widget/ui.errors';
 const window = getWindow();
 const ready = readyCallbacks.add;
@@ -278,7 +279,8 @@ function getCssClasses(themeName) {
 }
 
 let themeClasses;
-export function attachCssClasses(element, themeName) {
+
+function _attachCssClasses(element, themeName) {
     themeClasses = getCssClasses(themeName).join(' ');
     $(element).addClass(themeClasses);
 
@@ -302,8 +304,16 @@ export function attachCssClasses(element, themeName) {
     activateHairlines();
 }
 
+export function attachCssClasses(element, themeName) {
+    when(uiLayerInitialized).done(() => {
+        _attachCssClasses(element, themeName);
+    });
+}
+
 export function detachCssClasses(element) {
-    $(element).removeClass(themeClasses);
+    when(uiLayerInitialized).done(() => {
+        $(element).removeClass(themeClasses);
+    });
 }
 
 function themeReady(callback) {

apps/demos/testing/etalons/DataGrid-ColumnResizing (material.blue.light).png

@@ -3,6 +3,7 @@
 import $ from 'jquery';
 import themes from 'ui/themes';
 import viewPortUtils from 'core/utils/view_port';
+import { uiLayerInitialized } from '__internal/core/utils/m_common';
 
 const viewPortChanged = viewPortUtils.changeCallback;
 
@@ -250,6 +251,7 @@ QUnit.module('dx-theme links', (hooks) => {
     let $frame;
     const frames = [];
     hooks.beforeEach(() => {
+        uiLayerInitialized.resolve();
         themes.setDefaultTimeout(100);
         $frame = $('<iframe></iframe>').appendTo('body');
         frames.push($frame);
@@ -605,7 +607,11 @@ QUnit.module('dx-theme links', (hooks) => {
     });
 });
 
-QUnit.module('misc', () => {
+QUnit.module('misc', (hooks) => {
+    hooks.beforeEach(() => {
+        uiLayerInitialized.resolve();
+    });
+
     const DX_HAIRLINES_CLASS = 'dx-hairlines';
 
     test('attachCssClasses', function(assert) {