Skip to content

Instantly share code, notes, and snippets.

@mcclure
Last active September 12, 2020 04:53
Show Gist options
  • Save mcclure/b6185bd6778bc9aba4332f6239e06614 to your computer and use it in GitHub Desktop.
Save mcclure/b6185bd6778bc9aba4332f6239e06614 to your computer and use it in GitHub Desktop.
/*
This short Typescript snippet works with:
"dependencies": {
"immutable": "^4.0.0-rc.12",
"preact": "^10.1.0",
"webpack": "^4.29.6",
"webpack-cli": "^3.2.3"
},
"devDependencies": {
"ts-loader": "^6.2.1",
"copy-webpack-plugin": "^5.1.0",
"source-map-loader": "^0.2.4",
"typescript": "^3.7.3"
}
But it CRASHES with:
"dependencies": {
"immutable": "^4.0.0-rc.12",
"preact": "^10.4.8",
"webpack": "^4.44.1",
"webpack-cli": "^3.3.12"
},
"devDependencies": {
"ts-loader": "^8.0.3",
"copy-webpack-plugin": "^6.1.0",
"source-map-loader": "^1.1.0",
"typescript": "^4.0.2"
}
Somehow, immutable.js goes into an infinite loop with the second set of packages,
even though immutable.js is identical between the two.
*/
import { h, render, Component } from "preact";
import { useContext, useState, useEffect } from "preact/hooks";
import { OrderedSet } from "immutable"
declare let require:any
let parentNode = document.getElementById("content")
let replaceNode = document.getElementById("initial-loading")
let demoSet = OrderedSet<string>().add("one").add("two")
class Content extends Component<any, any> {
constructor(props:{}) {
super(props);
this.state = {};
}
render() {
// THE CRASH HAPPENS HERE; IF I DON'T RETURN JSX FROM THE MAP FN, IT WORKS FINE
const divArray = demoSet.map(
s => {
console.log("Inside map", typeof(s), s)
return <div className="Id">{s}</div>
}
).toJS()
return (
<div>Hello<br />{divArray}</div>
)
}
}
render(
<Content />,
parentNode, replaceNode
);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment