function showMessage(message) {
  const messageElement = document.getElementById('msg');
  messageElement.innerHTML = message + '\n' + messageElement.innerHTML;
}

function clearMessages() {
  document.getElementById('msg').innerHTML = '';
}

function showElement(id) {
  document.getElementById(id).style.display = 'block';
}

function hideElement(id) {
  document.getElementById(id).style.display = 'none';
}

function hideElements() {
  const elements = [
    'checking',
    'installed',
    'installing',
    'uninstalling',
    'not-installed',
  ];
  for (const id of elements) {
    hideElement(id);
  }
}

async function checkCard(swUrl, scopeId, methodId) {
  const registration = await navigator.serviceWorker.getRegistration(swUrl);
  if (!registration) {
    return false;
  }
  document.getElementById(scope).innerHTML = registration.scope;
  document.getElementById('scope').innerHTML = registration.scope;
  if (!registration.paymentManager) {
    return false;
  }
  if (!registration.paymentManager.instruments) {
    return false;
  }
  const result = await registration.paymentManager.instruments.has('card-id');
  if (!result) {
    return false;
  }
  const instrument = await registration.paymentManager.instruments.get('card-id');
  document.getElementById(method).innerHTML = instrument.method;
  return true;
}

async function check() {
  clearMessages();
  hideElements();
  showElement('checking');

  if (!navigator.serviceWorker) {
    hideElement('checking');
    showMessage('No service worker capability in this browser.');
    return;
  }
  
  try {
    const card1installed = await checkCard('./app.js?card=1', 'scope1', 'method1');
    const card2installed = await checkCard('./app.js?card=2', 'scope2', 'method2');
    if (card1installed && card2installed) {
      showElement('installed');
    } else {
      showElement('not-installed');
    }
  } catch (error) {
    showElement('not-installed');
    showMessage(error);
  }

  hideElement('checking');
}

const publicKeyCredentialCreationOptions = {
    challenge: Uint8Array.from(
        'INSECURE.SHOULD-BE-A-RANDOM-STRING-FROM-SERVER', c => c.charCodeAt(0)),
    rp: {
        name: 'rsolomakhin.github.io',
        id: 'rsolomakhin.github.io',
    },
    user: {
        id: Uint8Array.from(
            'IOFIVBNMUJ', c => c.charCodeAt(0)),
        name: 'insecure-demo@rsolomakhin.github.io',
        displayName: 'Demo, Insecure',
    },
    pubKeyCredParams: [{alg: -7, type: 'public-key'}],
    authenticatorSelection: {
        authenticatorAttachment: 'platform',
        userVerification: 'discouraged',
    },
    timeout: 60000,
    attestation: 'none'
};

async function install() {
  hideElements();
  showElement('installing');


  try {
    if (navigator.credentials && navigator.credentials.create) {
      const credential = await navigator.credentials.create({
        publicKey: publicKeyCredentialCreationOptions
      });
    }

    ////////////////////////////////////////////////////////////////////////////
    //
    // Install the first card.
    //
    ////////////////////////////////////////////////////////////////////////////
    window.location.href = './card1';
  } catch(error) {
    hideElement('installing');
    showMessage(error);
  }
}

async function uninstall() {
  hideElements();
  showElement('uninstalling');

  try {
    let registration = await navigator.serviceWorker.getRegistration('app.js?card=1');
    if (registration) {
      await registration.unregister();
    }
    registration = await navigator.serviceWorker.getRegistration('app.js?card=2');
    if (registration) {
      let result = await registration.unregister();
      if (!result) {
        hideElement('uninstalling');
        showElement('installed');
        showMessage('Service worker unregistration returned "false", which indicates that it failed.');
      }
    }
    hideElement('uninstalling');
    showElement('not-installed');
  } catch (error) {
    hideElement('uninstalling');
    showMessage(error);
  }
}

check();

@@ -612,1389 +612,8 @@
 %0A%7D%0A%0A
-async function checkCard(swUrl, scopeId, methodId) %7B%0A  const registration = await navigator.serviceWorker.getRegistration(swUrl);%0A  if (!registration) %7B%0A    return false;%0A  %7D%0A  document.getElementById(scope).innerHTML = registration.scope;%0A  document.getElementById('scope').innerHTML = registration.scope;%0A  if (!registration.paymentManager) %7B%0A    return false;%0A  %7D%0A  if (!registration.paymentManager.instruments) %7B%0A    return false;%0A  %7D%0A  const result = await registration.paymentManager.instruments.has('card-id');%0A  if (!result) %7B%0A    return false;%0A  %7D%0A  const instrument = await registration.paymentManager.instruments.get('card-id');%0A  document.getElementById(method).innerHTML = instrument.method;%0A  return true;%0A%7D%0A%0Aasync function check() %7B%0A  clearMessages();%0A  hideElements();%0A  showElement('checking');%0A%0A  if (!navigator.serviceWorker) %7B%0A    hideElement('checking');%0A    showMessage('No service worker capability in this browser.');%0A    return;%0A  %7D%0A  %0A  try %7B%0A    const card1installed = await checkCard('./app.js?card=1', 'scope1', 'method1');%0A    const card2installed = await checkCard('./app.js?card=2', 'scope2', 'method2');%0A    if (card1installed && card2installed) %7B%0A      showElement('installed');%0A    %7D else %7B%0A      showElement('not-installed');%0A    %7D%0A  %7D catch (error) %7B%0A    showElement('not-installed');%0A    showMessage(error);%0A  %7D%0A%0A  hideElement('checking');%0A%7D%0A%0A
 cons
@@ -2648,14 +2648,4 @@
 %7D%0A%7D%0A
-%0Acheck();%0A

Remove checker