Clipboard.js: Faulty behaviour when browser access is not permitted.

[wpp]

Hello,

This is a bit of an edge-case and might not have a _proper_ solution. But since the project supports IE9+
and I'd qualify this as a "case where you'd like to show some user feedback".

I thought I'd be worth mentioning here.

Steps to reproduce:

1. Visit http://zenorocha.github.io/clipboard.js/
2. Click one of the triggers in the examples
3. Click on deny access, when prompted for clipboard permissions by the browser. (see screenshot)
4. UI responds as if the copy to clipboard succeeded. (see screenshot)

AFAIK the root cause of the problem is that document.execCommand returns true even if it does not have permissions.

• OS: Windows 7 (Home Premium)
• Browser Version: IE 9 (see screenshot)

Thanks for a great library with superb documentation.
Cheers.

[zenorocha]

Thanks a lot for such detailed explanation @wpp. We'll see what options we have to fix this.

[jylertones]

Found a possible approach - you can use document.execCommand('paste') on another node and see if it pasted:

var didItWork = false;
var checkDiv = document.createElement('textarea');
checkDiv.position = 'absolute';
...
document.body.appendChild(checkDiv);
checkDiv.select();

try {
    document.execCommand('paste');
    didItWork = checkDiv.value == "<coped string>";
} finally {
    document.body.removeChild(checkDiv);
}

[jylertones]

Also worth noting, I believe this problem happens in both IE9 and IE10. IE11 appears to return the correct value from execCommand.

[zenorocha]

Hey guys,

I don't think we have a proper solution for this. For now, we'll describe this as a known bug on the wiki page.

Thanks again for reporting @wpp and @jylertones for trying to help.

[roseforyou]

//original code:
try { e = document.execCommand(this.action) } catch (n) { e = !1 }

//is OK???
try { e = window.clipboardData ? window.clipboardData.setData('Text', this.selectedText) : document.execCommand(this.action) } catch (n) { e = !1 }

[tmakin]

The following error trap is working for me on IE11 inside my success handler

const clipboardData = window['clipboardData'];
if (clipboardData && clipboardData.getData) {
  if (!clipboardData.getData('Text')) {
    // display failure message
    return;
  }
}

[dongyanghe]

因为之前可能已经有复制内容，会导致误判，所以我加了剪切板的内容对比，这样可能会比较完整：

copyeSuccessFun:  function(e) {
        if (!ClipboardJS.isSupported()) {
            //  copyeErrorFun()
           console.log('复制失败');
            return
        }
        const clipboardData = window['clipboardData'];
        if (clipboardData && clipboardData.getData) {
            if (!clipboardData.getData('Text') || e.text != clipboardData.getData('Text')) {
                //  copyeErrorFun()
                console.log('复制失败');
                return;
            }
        }
        console.log('复制成功');
    }