单击时使用通电复制到剪贴板

如何解决单击时使用通电复制到剪贴板

我创建了一个按钮来获取卡片的 url 并将相对路径添加到我们自己的 url 中，以阻止它在发布到 Flock 时显示描述。

现在它在弹出窗口中显示拼接的 url，我们必须手动复制，我们想要的功能是单击按钮并复制文本。

var GRAY_ICON = 'https://cdn.hyperdev.com/us-east-1%3A3d31b21c-01a0-4da2-8827-4bc6e88b7618%2Ficon-gray.svg';

var onBtnClick = function (t,opts) {
  return t.card("url").then(function (card) {
    var str = JSON.stringify(card,null,2);
    var parsedURL = JSON.parse(str);
    const url = new URL(parsedURL.url);
    var shortUrl = "Our custom URL" + url.pathname
    updateClipboard(shortUrl); //DOESN'T WORK
    return t.popup({
      title: "Flock Link",items: [{
        text: "Our custom URL" + url.pathname //WORKS AND SHOWS IN POPUP
      }]
    });
  }).catch(error => console.log(error));
};

function updateClipboard(newClip) {
  navigator.clipboard.writeText(newClip).then(function () {
    console.log('Success: ' + newClip);
  },function () {
    console.log('Failed to copy');
  });
} +

window.TrelloPowerUp.initialize({
  'card-buttons': function (t,opts) {
    return [{
      icon: GRAY_ICON,text: 'Flock Link',callback: onBtnClick,condition: 'edit',backgroundColor: '#263340',color: '#ffffff'
    },() => {
      console.log('reached');
      var btn = document.querySelector('.button-link[title="Flock Link"]')
      btn.style.backgroundColor = '#263340';
      btn.style.color = '#ffffff';
    }];
  }
});

因此，我尝试删除 t.popup 并改为使用 navigator.clipboard or document.execCommand as per the docs，但我无法让它工作。

编辑：这是我在 Firefox 控制台中得到的错误：

Uncaught (in promise) TypeError: 'clipboard-write' (value of 'name' member of PermissionDescriptor) is not a valid value for enumeration PermissionName.

在 Chrome 中，我没有收到错误消息，但有这条消息：

'剪贴板权限状态被拒绝'

根据标志，这绝对不是真的。

第二个问题是尝试更改按钮的颜色 - 这应该非常简单，但我一定是想多了，因为无论如何我都无法获得任何后续功能或其他属性来影响按钮。