Cannot read properties of undefined (reading 'iterator') in Kotlin Multiplatform - javascript

I am trying to run a kmm project js files on a browser. Here the html:
<html lang="en">
<head>
<meta charset="UTF-8">
<script src="../packages_imported/kotlin/1.5.10/kotlin.js"></script>
<script src="../packages_imported/KotlinBigInteger-bignum-js-legacy/0.3.2/KotlinBigInteger-bignum-js-legacy.js"></script>
<script src="../packages_imported/kotlinx-coroutines-core/1.5.0-native-mt/kotlinx-coroutines-core.js"></script>
<script src="../packages_imported/ktor-ktor-io-js-legacy/1.6.0/ktor-ktor-io-js-legacy.js"></script>
<script src="../packages_imported/kotlinx-serialization-kotlinx-serialization-core-js-legacy/1.2.1/kotlinx-serialization-kotlinx-serialization-core-js-legacy.js"></script>
<script src="../packages_imported/kotlinx-serialization-kotlinx-serialization-json-js-legacy/1.2.1/kotlinx-serialization-kotlinx-serialization-json-js-legacy.js"></script>
<script src="../packages_imported/ktor-ktor-utils-js-legacy/1.6.0/ktor-ktor-utils-js-legacy.js"></script>
<script src="../packages_imported/ktor-ktor-http-js-legacy/1.6.0/ktor-ktor-http-js-legacy.js"></script>
<script src="../packages_imported/ktor-ktor-http-cio-js-legacy/1.6.0/ktor-ktor-http-cio-js-legacy.js"></script>
<script src="../packages_imported/ktor-ktor-client-core-js-legacy/1.6.0/ktor-ktor-client-core-js-legacy.js"></script>
<script src="./parippu-vada/kotlin/parippu-vada.js"></script>
<title>Title</title>
</head>
<body>
</body>
</html>
This throws the following error:
_Collections.kt:1618 Uncaught TypeError: Cannot read properties of undefined (reading 'iterator')
at _Collections.kt:1618
at parippu-vada.js:23
at parippu-vada.js:25
Its shows error in collections.kt #:
/**
* Applies the given [transform] function to each element of the original collection
* and appends the results to the given [destination].
*/
public inline fun <T, R, C : MutableCollection<in R>> Iterable<T>.mapTo(destination: C, transform: (T) -> R): C {
for (item in this) <- this throw error
destination.add(transform(item))
return destination
}
Its probably related to kotlin version because the error is in auto-generated file. Is there anything I can do about this.
Am almost giving up on kmm, some inspiration would be nice !

Related

p5.js web editor. ' Uncaught TypeError: Cannot read property 'split' of undefined (: line 57)'

I recently started working on this project last few days from CodingTrain, however I kept running into this 'split' error. I've tried looking around how to fix it but I'm very new to JS. If anyone can help I would greatly appreciate it.
Sketch.js
let brain;
function setup() {
createCanvas(640, 480);
let options = {
inputs: 34,
outputs: 4,
task: 'classification',
debug: true
}
brain = ml5.neuralNetwork(options);
brain.loadData('ymca.json', dataReady);
}
function dataReady() {
brain.normalizeData();
brain.train({epochs: 50}, finished);
}
function finished() {
console.log('model trained');
brain.save();
}
index.html
<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.10.2/p5.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.10.2/addons/p5.sound.min.js"></script>
<script src="https://unpkg.com/ml5#0.5.0/dist/ml5.min.js"></script>
<link rel="stylesheet" type="text/css" href="style.css">
<meta charset="utf-8" />
</head>
<body>
<script src="sketch.js"></script>
</body>
</html>
Split is reserved for strings so at some point looks like P5 is expecting a string but not getting it. You should be able to follow the error stack in your dev tools console and see what line of your code the error is coming from.

p5 within IIFE, Uncaught TypeError: Cannot read property 'className' of undefined

I'm trying to run p5 inside an IIFE but getting this error:
Uncaught TypeError: Cannot read property 'className' of undefined
It doesn't show up without IIFE.
sketch.js
var sketch = (function(p5) {
setup = function() {
p5.createCanvas(p5.windowWidth, p5.windowHeight);
p5.background(0);
};
}(new p5(sketch, "canvas")));
index.html
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="style.css" />
<script src="http://cdnjs.cloudflare.com/ajax/libs/p5.js/0.4.23/p5.js"></script>
</head>
<body>
<script language="javascript" type="text/javascript" src="main.js"></script>
<div id = "canvas"></div>
</body>
</html>
Your syntax is a little weird. Why are you wrapping both the function and the call to new p5() in parenthesis? Also, you're missing a variable name for the setup() function definition.
Correcting all of that would look like this:
var sketch = function(p5) {
p5.setup = function() {
p5.createCanvas(p5.windowWidth, p5.windowHeight);
p5.background(0);
};
}
new p5(sketch, "canvas");
I also would not use p5 as a variable or parameter name since that's the name of the overall p5.js library, so I'd do something like this:
var s = function(sketch) {
sketch.setup = function() {
sketch.createCanvas(sketch.windowWidth, sketch.windowHeight);
sketch.background(0);
};
}
new p5(s, "canvas");
More info can be found in the p5.js GitHub wiki.

Why is index.html being treated as JSON? Unexpected token < at position 0

I am trying to use Qunit to make unit tests for this html. The error I'm getting is Uncaught SyntaxError: Unexpected token < in JSON at position 0. It's pointing to the "<" in <!DOCTYPE html> Clearly this isn't JSON, but it thinks it is, but I'm not sure why.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Pinpoint Test</title>
<link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-2.0.0.css">
<script type="text/javascript" src="https://code.jquery.com/qunit/qunit-2.0.0.js"></script>
<script type="text/javascript" src="lib/jquery-3.0.0.min.js"></script>
<script type="text/javascript" src="jshamcrest.js"></script>
<script type="text/javascript" src="core.js"></script>
<script type="text/javascript" src="integration.js"></script>
<script type="text/javascript" src="jsmockito-1.0.4.js"></script>
<script type="text/javascript" src="lib/handlebars-v4.0.5.js"></script>
<script type="text/javascript" src="bootstrap.min.js"></script>
<script src="pinpoint.js"></script>
<script src="pinpointTest.js"></script>
</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture">
//a lot more html
</body>
</html
It says Source: at window.onerror (https://code.jquery.com/qunit/qunit-2.0.0.js:322:11)
qunit-2.0.0.js:
// Cover uncaught exceptions
// Returning true will suppress the default browser handler,
// returning false will let it run.
window.onerror = function( error, filePath, linerNr ) {
var ret = false;
if ( onErrorFnPrev ) {
ret = onErrorFnPrev( error, filePath, linerNr );
}
// Treat return value as window.onerror itself does,
// Only do our handling if not suppressed.
if ( ret !== true ) {
if ( QUnit.config.current ) {
if ( QUnit.config.current.ignoreGlobalErrors ) {
return true;
}
QUnit.pushFailure( error, filePath + ":" + linerNr );
} else {
//322 QUnit.test( "global failure", extend( function() {
QUnit.pushFailure( error, filePath + ":" + linerNr );
}, { validTest: true } ) );
}
return false;
}
return ret;
};
My guess is that missing > at the end of your html file is just a typo in this example? I think you might need to put all these <script> tags at the end of your <body> instead of in the <head>... QUnit wants that <div id="qunit"></div> tag to put its UI in, and as it is, your tests are trying to run before the HTML ever loads. Give that a try, but if it doesn't work, can you simplify your test to just a simple assert.equall(1, 1) to see if that works? You could also update the question with your actual tests if you want us to look at them.

head.js throwing property js not found errors

Chrome throws the following error:
Uncaught TypeError: Property 'js' of object function
(){d.ready.apply(null,arguments)} is not a function
While Firefox throws a TypeError: head.js is not a function
Here is my code:
<!doctype html>
<html lang="eng" ng-app="app">
<head>
<meta charset="UTF-8">
<title>{{ page_title }}</title>
<script src="http://cdnjs.cloudflare.com/ajax/libs/headjs/0.99/head.core.min.js"></script>
</head>
<script>
head.js({ angularJS: "https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"},
{ jQuery: "http://code.jquery.com/jquery-1.10.1.min.js" },
{ internalApp: "app/js/app.js"});
head.ready('jQuery', function() {
$(document).ready(function() {
console.log('jQuery loaded successfully');
});
});
</script>
<body>
<!-- add data here -->
</body>
</html>
You have loaded the Responsive Design + Feature Detections script http://cdnjs.cloudflare.com/ajax/libs/headjs/1.0.3/head.core.min.js and not the Asset Loader http://cdnjs.cloudflare.com/ajax/libs/headjs/1.0.3/head.load.min.js
I just made the same mistake and found this post while looking up the answer :)

Using data-dojo-id in dojo 1.7

I try to use some 'dijit' widget from script, for example to change content or to connect event.
For this purpose I try to use 'data-dojo-id' attribute in html, which (as I understood) creates global object of type 'data-dojo-type' and name 'data-dojo-id'.
But I got errors... What I do wrong?
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Dojo test</title>
</head>
<body>
<div id="myDivId"
data-dojo-type="dijit.layout.ContentPane"
data-dojo-id="myDojoId">
Hello Everyone!
</div>
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.7.1/dojo/dojo.js" data-dojo-config="async: true, parseOnLoad:true"></script>
<script type="text/javascript">
require(["dijit/dijit", "dijit/layout/ContentPane"], function(){
//myDojoId.setContent("Hello World!"); // error : myDojoId is not defined
// Even this not working:
console.log(dijit.byId("myDivId")); // undefined
console.log(dijit.byId("myDojoId")); // undefined
});
</script>
</body>
</html>
data-dojo-id and jsId (deprecated) attributes create a global object referring to that dijit.
I believe you need to wrap the lookups in a ready() call
<script type="text/javascript">
require(["dojo/ready","dijit/dijit", "dijit/layout/ContentPane"], function(ready,dijit,ContentPane){
//shouldn't be defined yet
console.log(dijit.byId("myDivId")); // undefined
console.log(myDojoId); // undefined
ready(function(){
console.log(dijit.byId("myDivId"));
//note how data-dojo-id doesn't have the lookup
console.log(myDojoId);
});
});
</script>

Categories