From a1139ec371e5fea85c7f6fc2ea0636b154e3abff Mon Sep 17 00:00:00 2001 From: Jordan Eldredge Date: Tue, 22 Oct 2019 16:32:43 -0700 Subject: [PATCH] Avoid flash of no background when switching background images --- modern/src/utils.ts | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/modern/src/utils.ts b/modern/src/utils.ts index 63db93ac..532b9506 100644 --- a/modern/src/utils.ts +++ b/modern/src/utils.ts @@ -351,7 +351,18 @@ export function findXmlElementById( // This is intentionally async since we may want to sub it out for an async // function in a node environment export async function getUrlFromBlob(blob: Blob): Promise { - return URL.createObjectURL(blob); + // We initiallay used `URL.createObjectURL(blob)` here, but it had an issue + // where, when used as a background imaged, they would take more than one + // frame to load resulting in a white flash when switching background iamges. + return new Promise((resolve, reject) => { + const reader = new FileReader(); + reader.onload = function(e) { + // @ts-ignore This API is not very type-friendly. + resolve(e.target.result); + }; + reader.onerror = reject; + reader.readAsDataURL(blob); + }); } async function loadImage(