如何在Cypress中获取复制到剪贴板的内容 [英] How to fetch copied to clipboard content in cypress

问题描述

如何在cypress中获取剪贴板内容。我的网络应用程序中有一个按钮，单击该按钮后，系统将执行复制到剪贴板，并显示一条消息。下面是复制到剪贴板的url内容的示例（此url内容与网站url 不同）

解决方案

可以解决访问剪贴板的问题，但是主要问题是document.execCommand（'copy'）不起作用（如上所述），我认为这是应用程序的主要方法（也是唯一方法）

假设它以某种方式发生（或固定在上游），可以检查剪贴板的内容，例如通过使用剪贴板：

npm i -D剪贴板

plugins / index.js：

 常量剪贴板= require（'剪贴板'）; 
 module.exports =（on）=> {
 on（'task'，{
 getClipboard（）{
 returnlippy.readSync（）; 
} 
}）; 
}; 
  

在您的说明中：

  describe（'test'，（）=> {
 it（'test'，（）=> {
 cy.document（）。then（doc => ; {
 doc.body.innerHTML ='< input id = inp>'; 
}）; 
 cy.get（'＃inp'）。type（'test {selectall}'）; 
 cy.document（）。then（doc => {
 doc.execCommand（'copy'）; 
}）; 
 cy.task （'getClipboard'）。should（'contain'，'test'）; 
}）; 
}）; 
  

我希望这段代码对您有用。
谢谢。

How to get the 'clipboard' content in cypress. I have a button in my web application, on click of button system will perform 'copy to clipboard' and a message will get displayed. Below is an example of the url content that is copy to clipboard ( this url content is different from web site url)

https://someurl.net/machines/0c459829-a5b1-4d4b-b3c3-18b03c1c969a/attachments/a30ceca7-198e-4d87-a550-04c97fbb9231/download

I have double check that there is no href attribute in that button tag. So I have use a plugin called clipboardy and I have added plugins/index.js file

 const clipboardy = require('clipboardy');
    module.exports = ( on ) => {
        on('task', {
            getClipboard () {
                return clipboardy.readSync();
            }
        });
    };

In my test I have used cy.task() to get the clipboard content, but this is not printing the actual url content

cy.get('td').find('div').find('span').find('button').find('i').eq(0).click().then(()=>{
          cy.task('getClipboard').then((data)=>{
          console.log("Helloooo:"+data);
      })
    })

<td class="sc-hgRTRy duUdhJ">
<div>
<span class="sc-bYwvMP jTmLTC">
<span class="sc-jzJRlG iVpVVy">
<span role="button" aria-expanded="true" aria-haspopup="true" aria-owns="5aa03785-1370-455e-a838-4154f7481a7b">
<button class="sc-feJyhm cJOKrG">
<i class="icon fas fa-link sc-htpNat cQABgO" aria-hidden="true" data-component-type="icon">
</i>
</button>
</span>
</span>
</span>
</div>
</td>

解决方案

Accessing clipboard can be worked around, but the main issue is that the document.execCommand('copy') doesn't work (as stated above), which I reckon is the primary (and only?) way for your app to programmatically put a text to user's clipboard.

Assuming it happens somehow (or is fixed upstream), the checking the clipboard's contents can be done e.g. by using clipboardy:

npm i -D clipboardy

plugins/index.js:

const clipboardy = require('clipboardy');
module.exports = ( on ) => {
    on('task', {
        getClipboard () {
            return clipboardy.readSync();
        }
    });
};

In your specification:

describe('test', () => {
    it('test', () => {
        cy.document().then( doc => {
            doc.body.innerHTML = '<input id="inp">';
        });
        cy.get('#inp').type('test{selectall}');
        cy.document().then( doc => {
            doc.execCommand('copy');
        });
        cy.task('getClipboard').should('contain', 'test');
    });
});

I hope this code will be usefull for you. Thank you.

这篇关于如何在Cypress中获取复制到剪贴板的内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！