Two issues I am noticing:
- On any board (even one with NO POWER-UPS at all), I keep seeing this error, about 1 for every card on the Board I load:
The resource was preloaded using link preload but not used within a few seconds from the window’s load event. Please make sure it has an appropriate
asvalue and it is preloaded intentionally.
- My card-back-section loads fine the first time. But subsequent loads, until I do a hard refresh - it takes up to 10 seconds for the back section to even render the heading, much less the page.
I built a basic “hello world” Power-Up, with a card-back-section and reproduced the problem, so I know it is not my code. In the sample I see client.js takes <20ms to load and complete from render but then up to 10 seconds (sometimes 15+ seconds) between the iFrame - t.signUrl() and the t.render() in the details.js for the card-back-section.
What gives?
Here is my sample…
Here is index.html:
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta http-equiv="Cache-control" content="no-cache"/>
<meta http-equiv="pragma" content="no-cache"/>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>demote-a-card</title>
<script src="./client.js" defer="defer"></script>
</head>
<body>
<script crossorigin="anonymous" src="https://p.trellocdn.com/power-up.min.js"></script>
</body>
</html>
client.js - ref in index.html
/* global TrelloPowerUp window */
window.TrelloPowerUp.initialize({
'card-back-section': async(t, opts) => {
return {
title: "Hello World",
icon: `data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsIAAA7CARUoSoAAAAF2SURBVDhPtZMxT8JQEMfb0pI2xMbA0JWyNXQEJLHO7VrmfgAHTfgMLMTo0FknDU0TNze+gCbOSmSBwU2hgxMlAevd8wV95GG6+Euu73/v/e/aXlPhX8myrIBBUy4iXRmCIDicTqeeqqoHmKdp+lir1YaDweCeGHZx1u/vHTnOpWEYqSiKGWyRQI17juNc9cFDzNvEUay2ms1bkJtCXjTBE0WRCprFc70TTdO4Rb8DPa7rnoL+odfr6bZtP4HkFm0HeJ+xBrQg4WU+n7eSJLFR5wH8dfC3UJMGy+WyDJNGmQvwC4vFooyaNFAUZVUo/Pm5GdBbLBZXqEkD2Bjpuv6BOg/olSRpRNNv2u32NSzcoW0HeG9gJZAnQOx6/cKsVmc03YlZNWfgPacpi+/7rmma7yC5d8azDnhAb2AmNx6PJ77fGWqaqsmyvF8qleB19c9KpfJqWdZdo9E4juP4gdoJ3J8J6Xa7BgzXQr1er1/CMHwjBwyC8AW6vpgYpmCzMQAAAABJRU5ErkJggg==`,
content: {
type: 'iframe',
url: t.signUrl("./details.html"),
}
}
},
});
Here is details.html:
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta http-equiv="Cache-control" content="no-cache"/>
<meta http-equiv="pragma" content="no-cache"/>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<link crossorigin="anonymous" rel="https://p.trellocdn.com/power-up.min.css">
<title>demote-a-card</title>
<script src="./details.js" defer="defer"></script>
</head>
<body>
<div id="content"></div>
<script crossorigin="anonymous" src="https://p.trellocdn.com/power-up.min.js"></script>
</body>
</html>
And this is the details.js:
const t = window.TrelloPowerUp.iframe();
t.render(async () => {
document.getElementById("content").innerHTML = `<h1>Hello World</h1>`;
t.sizeTo("#content");
});
Here is a link: hello-world.zip
As you can see VERY basic. This loads ok’ish (<2 seconds on card-back the first time), but thereafter, it almost seems to load slower and slower and slower. Combined with the weird errors Trello is throwing above. Anyway, users are contacting me about my Power-Up being broken, so I am telling them “wait a minute.”
Anyone else seeing this? Trello - is this a known issue?