Using react polyfills but getting error Object doesn't support property or method 'repeat' in IE11

Viewed 1358

I am using the react polyfills and the site works in IE11 except when using

   changeHeight() {
     let height = 0;
       for (let child of this.Element.current.children) {
       height = Math.max(height, child.clientHeight);
       }
    this.Element.current.style.height = `${height}px`;
    }

The error in IE is Object doesn't support property or method 'repeat'

I have defined the browser in the package.json and imported the below

  • import 'react-app-polyfill/ie11';
  • import 'react-app-polyfill/stable'

but the page will not render.

I am also getting the error

SCRIPT5022: Exception thrown and not caught

main.chunk.js (6068,465)

1 Answers

IE 11 doesn't support the new ECMAScript 2015's repeat() method. You could add the following polyfill to fix it:

if (!String.prototype.repeat) {
  String.prototype.repeat = function(count) {
    'use strict';
    if (this == null)
      throw new TypeError('can\'t convert ' + this + ' to object');

    var str = '' + this;
    // To convert string to integer.
    count = +count;
    // Check NaN
    if (count != count)
      count = 0;

    if (count < 0)
      throw new RangeError('repeat count must be non-negative');

    if (count == Infinity)
      throw new RangeError('repeat count must be less than infinity');

    count = Math.floor(count);
    if (str.length == 0 || count == 0)
      return '';

    // Ensuring count is a 31-bit integer allows us to heavily optimize the
    // main part. But anyway, most current (August 2014) browsers can't handle
    // strings 1 << 28 chars or longer, so:
    if (str.length * count >= 1 << 28)
      throw new RangeError('repeat count must not overflow maximum string size');

    var maxCount = str.length * count;
    count = Math.floor(Math.log(count) / Math.log(2));
    while (count) {
       str += str;
       count--;
    }
    str += str.substring(0, maxCount - str.length);
    return str;
  }
}
Related