Completed
Last Updated: 27 Sep 2023 10:44 by ADMIN
David
Created on: 10 Apr 2023 13:48
Category: Kendo UI for jQuery
Type: Bug Report
3
kendo.observable(obj) fails with 'e.bind not a function'

When an object is passed to an iframe method and kendo.observable is called on it, an error is thrown.  This error is new in the latest kendo releases and appears to be from a change to how kendo decides if something is an object.  Kendo now uses   { Object.getPrototypeOf(value) === Object.getPrototypeOf({})) } which it did not do in prior releases.  This test fails when the object tested is passed in from another frame.

You can repo this issue on the test site we setup:   Kendo UI Snippet (sixdisciplines.com)

Click the 'Call IFrame' button and notice the following error thrown:

    Uncaught TypeError: e.bind is not a function
    at init.wrap (kendo.all.js:318535:21)
    at kendo.all.js:318535:21
    at Array.forEach (<anonymous>)
    at new init (kendo.all.js:318535:21)
    at n.observable (kendo.all.js:318535:21)
    at iframeMethod (iframetest.html?5:14:25)
    at callIFrame (test.html:17:55)
    at HTMLButtonElement.onclick (test.html:21:34)

Following is the source used for this repo. I have also attached the html files.

Test.html:

      

<html>
<head>
    <meta charset="utf-8"/>
    <title>Kendo UI Snippet</title>

    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/themes/6.2.0/default/default-ocean-blue.css"/>

    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2023.1.314/js/kendo.all.min.js"></script>
</head>
<body>

<script>

  function callIFrame(){
debugger;

        var obj = new Object({ p1: 1, p2: 2, child: new Object({ c1: 1, c2: 2 }) });
document.getElementById('targetFrame').contentWindow.iframeMethod(obj);
  }

</script>
  <button onclick="callIFrame()">Call IFrame</button>

 <iframe id='targetFrame' src='iframetest.html?5'></iframe>
</body>   
</html>

iframetest.html

<html>
<head>
    <meta charset="utf-8"/>
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/themes/6.2.0/default/default-ocean-blue.css"/>

    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2023.1.314/js/kendo.all.min.js"></script>
</head>
<body>

<script>  
 function iframeMethod(obj){
debugger;
var observable = kendo.observable(obj);
alert('called')
 }
</script> 
IFrame with kendo 
</body>   
</html> 

  
1 comment
ADMIN
Martin
Posted on: 11 Apr 2023 11:53

Hello, David,

Thank you for reporting the behaviour.

I have converted the thread to a bug report in our Feedback Portal where you can track its status.

As a small token of gratitude, I am updating your Telerik Points.

Let me know if you have any questions.

Regards,
Martin
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.