CodingNic

Generator Features

Copy the Current Password

Generator Features 12 min read

Copy the Current Password

Copy the Current Password

Give the existing Copy button one reusable action.

1. Start with the basic clipboard path

Add:

javascript
async function copyText(text) {
  await navigator.clipboard.writeText(text);
}

Connect the existing button:

javascript
copyTop.addEventListener("click", () => copyText(output.textContent));

Generate a password and verify the clipboard value before adding any feedback.

2. Reuse the existing toast

Once the basic copy works, add these lines at the end of copyText():

javascript
const toast = $("toast");
toast.classList.add("show");
clearTimeout(window.secureGenToast);
window.secureGenToast = setTimeout(() => toast.classList.remove("show"), 1400);

3. Consider the browser fallback

If navigator.clipboard is rejected in the browser context you are using, wrap the clipboard call in try/catch and use a temporary textarea fallback. Keep this concern inside copyText() so the rest of the app does not need to know how copying works.

Test

Copy the current password several times. Confirm the clipboard contains the exact displayed value and the toast appears briefly.

Checkpoint

The current password can be copied through one reusable function, ready to be reused by history rows.