Skip to content
This repository has been archived by the owner on Dec 8, 2022. It is now read-only.

RC > Removed SKY CSS import #443

Merged
merged 11 commits into from
Aug 9, 2018
2 changes: 0 additions & 2 deletions e2e/skyux-lib-help-tests/skyux-lib-help.e2e-spec.js
Original file line number Diff line number Diff line change
@@ -45,8 +45,6 @@ import {
SkyModalDemoFormComponent
} from './modal-fixtures/modal-form-fixture.component';

require('style-loader!@blackbaud/skyux/dist/css/sky.css');

@NgModule({
imports: [
SkyAlertModule,
33 changes: 13 additions & 20 deletions utils/sky-style-loader.js
Original file line number Diff line number Diff line change
@@ -2,35 +2,28 @@

'use strict';

require('style-loader!@blackbaud/skyux/dist/css/sky.css');

var FontFaceObserver = require('fontfaceobserver');

var stylesAreLoaded = false;

var LOAD_TIMEOUT = 30000;
// Set to a number below Jasmine's default of 5000
// so that tests can still run if the font's fail to load.
const LOAD_TIMEOUT = 4000;

module.exports = {
loadStyles: function () {
var fontAwesome = new FontFaceObserver('FontAwesome');
var blackbaudSans = new FontFaceObserver('Blackbaud Sans');
var promise;

promise = Promise.all(
[
// Specify a character for FontAwesome since some browsers will fail to detect
// when the font is loaded unless a known character with a different width
// than the default is not specified.
fontAwesome.load('\uf0fc', LOAD_TIMEOUT),
blackbaudSans.load(null, LOAD_TIMEOUT)
]
);

promise.then(function () {
const fontAwesome = new FontFaceObserver('FontAwesome');
const blackbaudSans = new FontFaceObserver('Blackbaud Sans');

return Promise.all([
// Specify a character for FontAwesome since some browsers will fail to detect
// when the font is loaded unless a known character with a different width
// than the default is not specified.
fontAwesome.load('\uf0fc', LOAD_TIMEOUT),
blackbaudSans.load(null, LOAD_TIMEOUT)

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I had quite a few comments typed up before I realized this file is different from https://github.com/blackbaud/skyux-builder/blob/master/runtime/style-loader.ts

For clarification, this file is only called from https://github.com/blackbaud/skyux-builder/blob/19943499ea387f11965c6ccb9c4d35d6cc973f22/utils/spec-styles.js? and spec-styles is used at https://github.com/blackbaud/skyux-builder/blob/master/config/karma/shared.karma.conf.js?

If this is the case, and we're removing the automated loading of the Blackbaud Sans font, I wonder should we instead just remove the blackbaudSans.load() call?

Tangentially related, should we do the same thing to the runtime side?

]).then(() => {
stylesAreLoaded = true;
});

return promise;
},

stylesAreLoaded: function () {
8 changes: 6 additions & 2 deletions utils/spec-styles.js
Original file line number Diff line number Diff line change
@@ -2,13 +2,17 @@

'use strict';

var styleLoader = require('./sky-style-loader');
const styleLoader = require('./sky-style-loader');

// A race condition exists in Firefox where tests can begin before styles are loaded.
// This will ensure that styles are loaded before tests run by ensuring the style rule
// for the HTML hidden property defined in sky.scss has been applied.
(function () {
beforeAll(function (done) {
styleLoader.loadStyles().then(done);
styleLoader.loadStyles().then(done).catch((err) => {
console.warn('[Style Loader Error]', err);
// Allow tests to continue running even if fonts fail to load.
done();
});
});
}());