Error: StegImage#hideBlob: Mismatch after verification on image upload / key creation

[johnandersen777]

Error seen when while creating Dilithium, Falcon, or Sphincs key (tried all three)

918-9082c82850feae6b.js:28 Uncaught (in promise) Error: StegImage#hideBlob: Mismatch after verification; idx=1672 v1=27 v2=26 pos=0
    at b.hideBlob (918-9082c82850feae6b.js:28:42072)
    at b.hide (918-9082c82850feae6b.js:28:40892)
hideBlob @ 918-9082c82850feae6b.js:28
hide @ 918-9082c82850feae6b.js:28
Promise.then (async)
r @ 250-dc31191b7050df30.js:79
a @ 250-dc31191b7050df30.js:79
(anonymous) @ 250-dc31191b7050df30.js:79
(anonymous) @ 250-dc31191b7050df30.js:79
L.K @ index-555696497172b87e.js:1
(anonymous) @ index-555696497172b87e.js:1
(anonymous) @ main-bdaeb5abf53759e5.js:1
(anonymous) @ main-bdaeb5abf53759e5.js:1
r @ 250-dc31191b7050df30.js:79
g @ 250-dc31191b7050df30.js:79
Promise.then (async)
r @ 250-dc31191b7050df30.js:79
a @ 250-dc31191b7050df30.js:79
(anonymous) @ 250-dc31191b7050df30.js:79
(anonymous) @ 250-dc31191b7050df30.js:79
setTimeout (async)
(anonymous) @ index-555696497172b87e.js:1
load (async)
E @ index-555696497172b87e.js:1
(anonymous) @ index-555696497172b87e.js:1
(anonymous) @ 918-9082c82850feae6b.js:28
(anonymous) @ 918-9082c82850feae6b.js:28
Promise.then (async)
(anonymous) @ 918-9082c82850feae6b.js:28
(anonymous) @ 918-9082c82850feae6b.js:28
(anonymous) @ 918-9082c82850feae6b.js:28
eA @ framework-7751730b10fa0f74.js:1
eq @ framework-7751730b10fa0f74.js:1
(anonymous) @ framework-7751730b10fa0f74.js:1
rg @ framework-7751730b10fa0f74.js:1
rv @ framework-7751730b10fa0f74.js:1
(anonymous) @ framework-7751730b10fa0f74.js:1
oq @ framework-7751730b10fa0f74.js:1
eD @ framework-7751730b10fa0f74.js:1
rx @ framework-7751730b10fa0f74.js:1
nB @ framework-7751730b10fa0f74.js:1
nA @ framework-7751730b10fa0f74.js:1

Test image (related):

Code in question?:

didme.me/services/image.js

Lines 1 to 53 in 23f32c4

	import { RawFile, StegImage, utils } from 'steg';
	import { scrypt } from '@noble/hashes/scrypt';
	const { DID, JWK } = require('@transmute/did-jwk-pqc');
	const stegHardness = 5;
	const scryptConfig = {
	N: 2 ** 19,
	r: 8,
	p: 1
	};
	const encode = async (
	querySelector,
	securePassword,
	secureSalt,
	alg = 'CRYDI5'
	) => {
	const passwordBasedKey = scrypt(securePassword, secureSalt, scryptConfig);
	const key = await JWK.generateKeyPair(alg);
	const did = DID.toDid(key.publicKeyJwk);
	const file = new RawFile(
	utils.utf8ToBytes(did.replace('did:jwk:', '')),
	'did:jwk'
	);
	const el = document.querySelector(querySelector);
	const png = new StegImage(el);
	const hiddenPngUrl = await png.hide(file, passwordBasedKey, stegHardness);
	const didDocument = await DID.operations.resolve(did);
	return {
	did,
	image: hiddenPngUrl,
	didDocument,
	privateKeyJwk: key.privateKeyJwk
	};
	};
	const decode = async (querySelector, securePassword, secureSalt) => {
	const passwordBasedKey = scrypt(securePassword, secureSalt, scryptConfig);
	const el = document.querySelector(querySelector);
	const png = new StegImage(el);
	const revealed = await png.reveal(passwordBasedKey);
	const did = revealed.name + ':' + utils.bytesToUtf8(revealed.data);
	const { publicKeyJwk } = await DID.operations.dereference(did + '#0');
	const emojid = await DID.getEmojid(publicKeyJwk);
	const dataUrl = png.canvas.toDataURL();
	return { emojid, did, publicKeyJwk, dataUrl };
	};
	const image = { encode, decode };
	export default image;