Fetching an image works on IDE, but don't on watch (SDK 6.1)

[Sebafit]

Hi! I'm trying to put a png image on watch, but I can't... on Fitbit OS Simulator works like a charm, but not on watch...

What I'm doing wrong?

This is my app/index.js code:

inbox.onnewfile = () => {
let fileName;
do {
fileName = inbox.nextFile();
if (fileName) {
document.getElementById("coin").image = `/private/data/${fileName}`;
}
} while (fileName);
};

[Sebafit]

My watch is a Versa 3

[Gondwana]

If it works on sim but not watch, a common cause is because the image is the wrong size. The watch doesn't like resizing images.

[Sebafit]

I tried to print it at full size (300x300) and I got the same behavior 😞

[Sebafit]

I put a 300x300 image resized to 100x100 directly from resources and I see that image, but when runs this line 

document.getElementById("coin").image = `/private/data/${fileName}`;

image become invisible...

maybe how I put the image have a problem...

[Gondwana]

Try .href.

[Sebafit]

.image and .href has the same behavior

[Sebafit]

This is mi companion code:

fetch(coinURL)
.then(response => response.arrayBuffer())
.then(buffer => outbox.enqueue(destFilename, buffer))
.then(fileTransfer => {
console.log(`Enqueued ${fileTransfer.name}`);
});

[Sebafit]

Well... using txi conversion it's working, but if I load the same .png directly it load... why I can't pass the file?

fetch(coinURL)
.then(response => response.arrayBuffer())
.then(buffer => Image.from(buffer, "image/png"))
.then(image =>
image.export("image/vnd.fitbit.txi", {
background: "#FFFFFF"
})
)
.then(buffer => outbox.enqueue(destFilename, buffer))
.then(fileTransfer => {
console.log(`Enqueued ${fileTransfer.name}`);
}); 

[Gondwana]

The watch doesn't support PNG. It can only display TXI and (some) JPG.

[Sebafit]

But I can load PNG from resources 😕

[Gondwana]

PNG included in the source are converted to TXI as part of the build process.

[Sebafit]

SDK could make the same thing if I try to set an image from an url response 😞