Copy to cliboard

Is it in a dialog window or a plugin panel? A few suggestions:

Try putting the button inside of a form:

document.getElementById('container').innerHTML = `
  <dialog id="dialog">
    <form method="dialog"><button id="button">copy</button></form>
  </dialog>
`;

Or try using an input:

document.getElementById('container').innerHTML = `
  <dialog id="dialog">
    <form method="dialog"><input type="button" id="button">copy</button></form>
  </dialog>
`;

It’s possible that if you have any async calls before you get the copyText() method it not be initiated within the click event.

I would also wrap the call in a try catch block and call a known function (not anonymous) and add the event listener before calling showModal() and return a value from showModal().

@Velara thanks for replying.

I run the example code from a ui-entry-point with the following wrapper: export const commands = { main() { ... } }; That’s the only code in the repro plugin. Putting it in a <form> has no effect. <input type="button" /> is unsupported in XD. No async calls are happening. My example code above is the only code in the test plugin (not counting the wrapper).

Change this:

document.getElementById('dialog').showModal(); document.getElementById('button').addEventListener('click', () => { require('application').editDocument(() => require('clipboard').copyText('hello world') ); });

To this:

function copyToClipboard() {
    var clipboard = require("clipboard");
    clipboard.copyText('hello world');
}

document.getElementById('button').addEventListener('click', copyToClipboard);
var waiting = document.getElementById('dialog').showModal();

Thanks, tried it. Naming the function has no effect @Velara

What is var waiting =? Such code doesn’t make any sense. Promise should be awaited by caller. So I suppose it must be return dialog.showModal(); like it was suggested in the very beginning of the topic.

@nemtsov
I’ve read on here there might be issues with using innerHTML. You might want to try the append methods. Can you get any of the basic examples working here? Get those working first and then step by step add your own coding style back into the working example. The UXP environment is not the browser.

Also, it wasn’t clear if you were putting an await keyword in front of your showModal() call. If you don’t put an await in front of your call some events will occur out of the expected order. Assign your event listener before hand.

But if you use await then the next line won’t run until the dialog is closed.

@gdreyv
In the past I have had issues with async and await. Something like the following seemed to fix a lot of issues and in one function I had more than one dialog so I gave them each different names:

if (noArtboardSelected) {
  let dialog = await alertDialog.showModal();
  console.log("type of ", typeof dialog); // string
  return dialog;
}
else {
  let dialog = await showMainDialog();
  return dialog;
}