Conflict with IE11 due to usage of Array.prototype.includes()

Created on 3 November 2020, over 4 years ago
Updated 27 March 2023, almost 2 years ago

Problem/Motivation

When the module is enabled cookie popup doesn't show up in IE11 ,
due to use of Array.prototype.includes():
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes

This is used twice in the library:
https://git.drupalcode.org/project/eu_cookie_compliance_gtm/-/blob/7.x-1.x/js/eu_cookie_compliance_hooks.js#L45

Steps to reproduce

* Visit page with cookie popup using IE 11 browser ( can be checked with browserstack )

Proposed resolution

* Option 1) Change usage of includes() to support IE11
* Option 2) Provide a generic polyfill file which will handle different support issues , example polyfill which could handle includes() for strings and arrays:

// Polyfill for String.prototype.includes()
// @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes
if (!String.prototype.includes) {
  String.prototype.includes = function(search, start) {
    'use strict';

    if (search instanceof RegExp) {
      throw TypeError('first argument must not be a RegExp');
    }
    if (start === undefined) { start = 0; }
    return this.indexOf(search, start) !== -1;
  };
}

if (!Array.prototype.includes) {
  Object.defineProperty(Array.prototype, 'includes', {
    value: function (searchElement, fromIndex) {

      if (this == null) {
        throw new TypeError('"this" is null or not defined');
      }

      // 1. Let O be ? ToObject(this value).
      var o = Object(this);

      // 2. Let len be ? ToLength(? Get(O, "length")).
      var len = o.length >>> 0;

      // 3. If len is 0, return false.
      if (len === 0) {
        return false;
      }

      // 4. Let n be ? ToInteger(fromIndex).
      //    (If fromIndex is undefined, this step produces the value 0.)
      var n = fromIndex | 0;

      // 5. If n β‰₯ 0, then
      //  a. Let k be n.
      // 6. Else n < 0,
      //  a. Let k be len + n.
      //  b. If k < 0, let k be 0.
      var k = Math.max(n >= 0 ? n : len - Math.abs(n), 0);

      function sameValueZero(x, y) {
        return x === y || (typeof x === 'number' && typeof y === 'number' && isNaN(x) && isNaN(y));
      }

      // 7. Repeat, while k < len
      while (k < len) {
        // a. Let elementK be the result of ? Get(O, ! ToString(k)).
        // b. If SameValueZero(searchElement, elementK) is true, return true.
        if (sameValueZero(o[k], searchElement)) {
          return true;
        }
        // c. Increase k by 1.
        k++;
      }

      // 8. Return false
      return false;
    }
  });
}

Remaining tasks

- Choose a way to solve this issue
- Provide a patch

User interface changes

None.

API changes

None.

πŸ› Bug report
Status

Fixed

Version

1.0

Component

Code

Created by

πŸ‡΅πŸ‡±Poland sandboxpl Poland πŸ‡΅πŸ‡±

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

Production build 0.71.5 2024