Investigate upgrade to the latest es6-collections.js

[mmansoor-magento]

Overview

For the es6-collections.js library we need to identify the following additional details:

• If this library is used on Admin UI or Storefront Luma or both
• What exact functionality is using this particular library
• What is a preliminary scope of work to migrate to the new version.
• Is it possible to migrate without introducing BIC into Luma
• Level of the impact of updating dependency in terms of BIC

Investigation Outcome

A complete report of affected areas, ways to migrate code, and level of BIC caused by migration.

[m2-assistant]

Hi @mmansoor-magento. Thank you for your report.
To help us process this issue please make sure that you provided the following information:

• Summary of the issue
• Information on your environment
• Steps to reproduce
• Expected and actual results

Please make sure that the issue is reproducible on the vanilla Magento instance following Steps to reproduce. To deploy vanilla Magento instance on our environment, please, add a comment to the issue:

@magento give me 2.4-develop instance - upcoming 2.4.x release

For more details, please, review the Magento Contributor Assistant documentation.

Please, add a comment to assign the issue: @magento I am working on this

---

• Join Magento Community Engineering Slack and ask your questions in #github channel.

⚠️ According to the Magento Contribution requirements, all issues must go through the Community Contributions Triage process. Community Contributions Triage is a public meeting.

🕙 You can find the schedule on the Magento Community Calendar page.

📞 The triage of issues happens in the queue order. If you want to speed up the delivery of your contribution, please join the Community Contributions Triage session to discuss the appropriate ticket.

🎥 You can find the recording of the previous Community Contributions Triage on the Magento Youtube Channel

✏️ Feel free to post questions/proposals/feedback related to the Community Contributions Triage process to the corresponding Slack Channel

[m2-assistant]

Hi @ihor-sviziev. Thank you for working on this issue.
In order to make sure that issue has enough information and ready for development, please read and check the following instruction: 👇

• 1. Verify that issue has all the required information. (Preconditions, Steps to reproduce, Expected result, Actual result).

  Details

  If the issue has a valid description, the label Issue: Format is valid will be added to the issue automatically. Please, edit issue description if needed, until label Issue: Format is valid appears.

• 2. Verify that issue has a meaningful description and provides enough information to reproduce the issue. If the report is valid, add Issue: Clear Description label to the issue by yourself.

• 3. Add Component: XXXXX label(s) to the ticket, indicating the components it may be related to.

• 4. Verify that the issue is reproducible on 2.4-develop branch

  Details

  - Add the comment @magento give me 2.4-develop instance to deploy test instance on Magento infrastructure.
  - If the issue is reproducible on 2.4-develop branch, please, add the label Reproduced on 2.4.x.
  - If the issue is not reproducible, add your comment that issue is not reproducible and close the issue and stop verification process here!

• 5. Add label Issue: Confirmed once verification is complete.

• 6. Make sure that automatic system confirms that report has been added to the backlog.

[ihor-sviziev]

List of supported browsers:
Microsoft Edge, latest–1
Firefox latest, latest–1 (any operating system)
Chrome latest, latest–1 (any operating system)
Safari latest, latest–1 (Mac OS only)
Safari Mobile for iPad 2, iPad Mini, iPad with Retina Display (iOS 12 or later), for desktop storefront
Safari Mobile for iPhone 6 or later; iOS 12 or later, for mobile storefront
Chrome for mobile latest–1 (Android 4 or later) for mobile storefront
https://devdocs.magento.com/guides/v2.4/install-gde/system-requirements.html#supported-browsers

The es6-collections are providing the following polyfills:

• WeakMap - ✔ supported https://caniuse.com/mdn-javascript_builtins_weakmap
  

  magento2/lib/web/es6-collections.js

  Lines 8 to 22 in 7c6b636

  	//Polyfill global objects
  	if (typeof WeakMap == 'undefined') {
  	exports.WeakMap = createCollection({
  	// WeakMap#delete(key:void*):boolean
  	'delete': sharedDelete,
  	// WeakMap#clear():
  	clear: sharedClear,
  	// WeakMap#get(key:void*):void*
  	get: sharedGet,
  	// WeakMap#has(key:void*):boolean
  	has: mapHas,
  	// WeakMap#set(key:void*, value:void*):void
  	set: sharedSet
  	}, true);
  	}

• Map - ✔ supported https://caniuse.com/mdn-javascript_builtins_map
  

  magento2/lib/web/es6-collections.js

  Lines 24 to 46 in 7c6b636

  	if (typeof Map == 'undefined' || typeof ((new Map).values) !== 'function' || !(new Map).values().next) {
  	exports.Map = createCollection({
  	// WeakMap#delete(key:void*):boolean
  	'delete': sharedDelete,
  	//:was Map#get(key:void*[, d3fault:void*]):void*
  	// Map#has(key:void*):boolean
  	has: mapHas,
  	// Map#get(key:void*):boolean
  	get: sharedGet,
  	// Map#set(key:void*, value:void*):void
  	set: sharedSet,
  	// Map#keys(void):Iterator
  	keys: sharedKeys,
  	// Map#values(void):Iterator
  	values: sharedValues,
  	// Map#entries(void):Iterator
  	entries: mapEntries,
  	// Map#forEach(callback:Function, context:void*):void ==> callback.call(context, key, value, mapObject) === not in specs`
  	forEach: sharedForEach,
  	// Map#clear():
  	clear: sharedClear
  	});
  	}

• Set - ✔ supported https://caniuse.com/mdn-javascript_builtins_set
  

  magento2/lib/web/es6-collections.js

  Lines 48 to 67 in 7c6b636

  	if (typeof Set == 'undefined' || typeof ((new Set).values) !== 'function' || !(new Set).values().next) {
  	exports.Set = createCollection({
  	// Set#has(value:void*):boolean
  	has: setHas,
  	// Set#add(value:void*):boolean
  	add: sharedAdd,
  	// Set#delete(key:void*):boolean
  	'delete': sharedDelete,
  	// Set#clear():
  	clear: sharedClear,
  	// Set#keys(void):Iterator
  	keys: sharedValues, // specs actually say "the same function object as the initial value of the values property"
  	// Set#values(void):Iterator
  	values: sharedValues,
  	// Set#entries(void):Iterator
  	entries: setEntries,
  	// Set#forEach(callback:Function, context:void*):void ==> callback.call(context, value, index) === not in specs
  	forEach: sharedForEach
  	});
  	}

• WeakSet - ✔ supported https://caniuse.com/mdn-javascript_builtins_weakset
  

  magento2/lib/web/es6-collections.js

  Lines 69 to 80 in 7c6b636

  	if (typeof WeakSet == 'undefined') {
  	exports.WeakSet = createCollection({
  	// WeakSet#delete(key:void*):boolean
  	'delete': sharedDelete,
  	// WeakSet#add(value:void*):boolean
  	add: sharedAdd,
  	// WeakSet#clear():
  	clear: sharedClear,
  	// WeakSet#has(value:void*):boolean
  	has: setHas
  	}, true);
  	}

It looks like we can safely remove the es6-collections

Also, I see ec6-collections are used as a dependency for the MutationObserver polyfill library.
✔ The MutationObserver also natively supported by all supported browsers https://caniuse.com/mutationobserver, so we can remove it as well.

@sidolov could you review my summary?

[sivaschenko]

@ihor-sviziev thanks for the investigation and detailed results, the issue to eliminate the library was created: #33206