-
Notifications
You must be signed in to change notification settings - Fork 273
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat: create @ui5/webcomponents-ie11 package #2686
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
looks good, just slight naming and documentation remarks.
Also, the PR description says there are lifecycle hooks, but they are events.
packages/base/src/EventProvider.js
Outdated
@@ -55,6 +54,17 @@ class EventProvider { | |||
}); | |||
} | |||
|
|||
/** | |||
* Fires an event, awaits for all listeners' results to have resolved, and returns the results as an array. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
technically it doesn't await but returns the promises, could you change the description simply that it returns a promise and is always async?
packages/base/src/EventProvider.js
Outdated
* | ||
* @param eventName the event to fire | ||
* @param data optional data to pass to each event listener | ||
* @returns {Array} an array with the results of all event listeners |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
a single promise is returned, when resolved it will have the values
packages/base/src/UI5Element.js
Outdated
|
||
// FF, Safari | ||
if (!document.adoptedStyleSheets && !window.ShadyDOM) { | ||
} else if (hasNativeSupport()) { // FF, Safari |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
hasNativeSupport for what? I had to check the implementation, this name is too generic.
Move IE11-specific code from
base
to a new packageThis change reduces the ES6 bundle size by 4KB (by 2KB gzipped) by moving away IE11-specific code. The size of the ES5 bundle remains unchanged.
Changes:
@ui5/webcomponents-ie11
: new package that maintains all IE-related code. It uses framework hooks to plug seamlessly into the framework.base
package is completely free of IE11 code. It exposes a few new lifecycle hooks.main
andfiori
packages depend on@ui5/webcomponents-ie11
and import its features (IE11.js
).Edge.js
file, aimed at legacy Edge, has been removed. Legacy Edge should be treated as IE in terms of ES6 support, therefore it will work with the ES5 code, but not with the ES6 code, due to Legacy Edge not supporting object spread operator and rest parameters syntax, which are used throughout the framework and components.Refactoring:
base
project no longer understands the business logic of IE11 support (such as ShadyDOM, loading the polyfill, the CSS ponyfill, creating the IE style tags) but exposes lifecycle hooks instead.UI5Element.js
andStaticAreaItem.js
: now they both use the same internal functions and follow the same flow.getEffectiveStyle
function now works for the static area too (has an extra parameter). In addition, this function is now reused by the IE11 code.IE11 code lifecycle
IE11 CSS processing
BREAKING CHANGES:
base
package to the newie11
package. If you used them before:@ui5/webcomponents-ie11
as a dependency to your projectnpm i @ui5/webcomponents-ie11 --save
or
yarn add @ui5/webcomponents-ie11
import "@ui5/webcomponents-base/dist/features/browsersupport/IE11.js";
to
import "@ui5/webcomponents-ie11/dist/features/IE11.js";
and
import "@ui5/webcomponents-base/dist/features/browsersupport/IE11WithWebComponentsPolyfill.js";
to
import "@ui5/webcomponents-ie11/dist/features/IE11WithWebComponentsPolyfill.js";
import "@ui5/webcomponents-base/dist/features/browsersupport/Edge.js";
Legacy Edge is still supported with the ES5 bundle. If your app needs to support Legacy Edge, treat it as IE11 and transpile the code to ES5 as you would for IE11.