Critical Javascript error after upgrading to Telerik UI for Blazor 4.1.0

3 Answers 438 Views
General Discussions
Kevin
Top achievements
Rank 1
Kevin asked on 04 Apr 2023, 02:44 PM

I'm using the Telerik Blazor components in a Blazor Hybrid app and until now they've worked perfectly. Unfortunately with the latest release I get a parse error that prevents the entire library from loading. Has anyone else seen this?

"Uncaught TypeError: t.split(...).at is not a function", source: https://0.0.0.0/_content/Telerik.UI.for.Blazor/js/telerik-blazor.js (28)"

Kevin
Top achievements
Rank 1
commented on 04 Apr 2023, 03:03 PM

I de-minified "telerik-blazor.js" and this is the line it's complaining about. 

3 Answers, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 07 Apr 2023, 09:16 AM | edited on 18 Jul 2023, 04:32 PM

Hi Kevin,

The error occurs here in PDF.js, which is a dependency for the PDF Viewer component.

If at() is not a function, this implies that the app is running in an old WebView, which doesn't support this method. You can test this outside the context of our product - 

JavaScript

var foo = "foo+bar";
var bar = "bar";
var result1 = foo.split("+").at(-1);
var result2 = bar.split("+").at(-1);

The official support policy of Microsoft Blazor, our components, and also PDF.js (by default) is that they support the current official browser versions. Is is possible to upgrade the device WebView? If not, then another option is to download our source code and build the telerik-blazor.js file without the PDF Viewer, or with an older version of PDF.js.

Regards,
Dimo
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

0
Ed
Top achievements
Rank 1
Iron
answered on 13 Jul 2023, 03:46 PM | edited on 13 Jul 2023, 03:48 PM

I was getting this error when using the Android Emulator through Visual Studio. To resolve the error, take the following steps:

 

  1. Open the Android SDK manager from Visual Studio. TOOLS > Android > Android SDK Manager
  2. In the Android SDKs and Tools dialog, look for a button on the lower left labeled "(n) updates" and apply all updates where (n) is the number of updates to apply, the button is not shown if updates are not available. Then choose the SDK Platform (lastest) and apply it.
  3. Open the Android Device Manager from Visual Studio. TOOLS > Android > Android Device Manager.
  4. Choose your Android image, from the device list.
  5. Apply the latest SDK as the OS for that device.

Restart the application and the error should be resolved.

Note: I had to restart Visual Studio after the update. Before restarting Visual Studio, I received a long list of compiler errors. My theory is that VS still had processes running during the update process and could not see any of the Android SDKs. Restarting Visual Studio reset those processes.

0
Johan
Top achievements
Rank 1
Iron
Iron
answered on 18 Sep 2023, 09:48 AM | edited on 18 Sep 2023, 09:49 AM

Found this on stackoverflow, which seems to be the reason I get this error, my browser versions were too old and needed updating. Found at https://stackoverflow.com/questions/68464114/why-am-i-getting-at-is-not-a-function 

 

If you get this message, whatever platform you're running the code on does not support the method yet. It's quite new - while the most recent versions of most browsers support it, anything before 2021 definitely won't. This method was only very recently signed off on (end of August 2021) and incorporated into the official specification, so it won't exist in older environments. Either upgrade your environment, or add a polyfill.

Per the proposal document, a "rough polyfill" that should be standards-compliant for most cases is:

function at(n) {
    // ToInteger() abstract op
    n = Math.trunc(n) || 0;
    // Allow negative indexing from the end
    if (n < 0) n += this.length;
    // OOB access is guaranteed to return undefined
    if (n < 0 || n >= this.length) return undefined;
    // Otherwise, this is just normal property access
    return this[n];
}

const TypedArray = Reflect.getPrototypeOf(Int8Array);
for (const C of [Array, String, TypedArray]) {
    Object.defineProperty(C.prototype, "at",
                          { value: at,
                            writable: true,
                            enumerable: false,
                            configurable: true });
}

Simply run that before trying to use .at, and you should be able to use it, even on older incompatible environments. You can also install this more exhaustive shim instead if you wish.

Dimo
Telerik team
commented on 18 Sep 2023, 10:11 AM

Thanks for the polyfill tip, Johan
Tags
General Discussions
Asked by
Kevin
Top achievements
Rank 1
Answers by
Dimo
Telerik team
Ed
Top achievements
Rank 1
Iron
Johan
Top achievements
Rank 1
Iron
Iron
Share this question
or