JavaScript Snippet to Automate Copying Config Vars from one Heroku App to another using the UI

heroku-app-bulk-copy-config.md

Automate Copying Config Vars from one Heroku App to another using the UI

Press Reveal Config Vars on the App you want to copy from and run this to put an array of objects in your clipboard containing all the keys and values.

copy(
  document
    .querySelectorAll('.config-vars-list-table tr')
    .map((el) => {
      const n = el.querySelector('input');
      const name = n && n.value ? n.value : '';
      const v = el.querySelector('textarea');
      const value = v && v.value ? v.value : '';
      return name ? { name, value } : null;
    })
    .filter(Boolean),
);

Navigate to the App you want to copy the to and press Reveal Config Vars, add this Script in your console

const sleep = ({ seconds }) =>
  new Promise((proceed) => {
    console.log(`WAITING FOR ${seconds} SECONDS...`);
    setTimeout(proceed, seconds * 1000);
  });

const addVars = async (vars) => {
  const { name, value } = vars.slice(0)[0];
  const remainingVars = vars.slice(1);
  const nameField = document.querySelector('input[placeholder="KEY"]');
  const valueField = document.querySelector('textarea[placeholder="VALUE"]');
  if (nameField && valueField && name) {
    nameField.value = name;
    valueField.value = value;
    await sleep({ seconds: 0.5 });
    // DOES NOT WORK - I'VE NOT FOUND A WAY TO GET THE ADD BUTTON NOT TO BE DISABLED
    // FOCUS AND BLUR ON THE INPUTS WORKS WHEN USING THE MOUSE, BUT NOT WHEN
    // DOING THE SAME WITH JAVASCRIPT
    const submitButton = document.querySelector('.config-var-add [type="submit"]');
    submitButton.removeAttribute('disabled');
    submitButton.click();
  }
  await sleep({ seconds: 1 });
  if (remainingVars.length) {
    console.log(remainingVars.length, 'REMAINING');
    addVars(remainingVars);
  } else {
    console.log('DONE');
  }
};

Then Run the script like this, using the env vars you want to copy over

addVars([{ name: 'Developer', value: 'Jamie' }, { name: 'foo', value: 'bar' }]);