简体   繁体   English

如何在 Postman javascript 测试中将响应值复制到剪贴板?

[英]How do you copy response values to the clipboard in Postman javascript tests?

I've recently found out about the ability in postman to write pre-request and test scripts using javascript.我最近发现 postman 可以使用 javascript 编写预请求和测试脚本。

I'm trying to figure out if it's possible to copy a value to the clipboard during a test in conjunction with setting the postman environment variable.我试图弄清楚是否可以在测试期间结合设置 postman 环境变量将值复制到剪贴板。

For example:例如:

var jsonData = JSON.parse(responseBody);
postman.setEnvironmentVariable ("Action ID", jsonData.ActionId);
// set jsonData.ActionId to clipboard

There is a way that it could be achieved, by using the visualizer and bringing in the clipboard.js CDN.有一种方法可以通过使用可视化工具并引入clipboard.js CDN 来实现。

This is very basic but by adding this script to the Tests tab, you can see the variable value in the Visualize tab, in the response section.这是非常基本的,但是通过将此脚本添加到“ Tests ”选项卡,您可以在响应部分的“ Visualize ”选项卡中看到变量值。

pm.environment.set("Action_ID", pm.response.json().ActionId);

let template = `
<html>
<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.min.js"></script>
</head>
<body>
    <div>
    <div>
        <pre><code style="width:max-content!important;" id="copyText">${pm.environment.get('Action_ID')}</code></pre>
    </div>
    <button class="copyButton" type="button" data-clipboard-action="copy" data-clipboard-target="#copyText" style="background:green;color:white;">Copy to Clipboard</button>
    </div>
</body>
</html>
<script>
    var clipboard = new ClipboardJS('.copyButton');

    clipboard.on('success', function(e) {
        e.clearSelection();
        e.trigger.textContent = '✔ Copied!';
        window.setTimeout(function() {
            e.trigger.textContent = 'Copy to Clipboard';
        }, 2000);
    });
    clipboard.on('error', function(e) {
        e.clearSelection();
        e.trigger.textContent = '✗ Not Copied';
        window.setTimeout(function() {
            e.trigger.textContent = 'Copy to Clipboard';
        }, 2000);
    });

</script>`

pm.visualizer.set(template, pm.response.json())

在此处输入图像描述

@Danny Dainton That's super clever solution. @Danny Dainton 这是非常聪明的解决方案。 Thank you!谢谢!

Here's a simplier version with auto-copy.这是一个带有自动复制的更简单的版本。 No need to click on the button manually.无需手动单击按钮。

const response = pm.response.json();

let template = `<html><body>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.11/clipboard.min.js"></script>
    <code style="width:max-content!important;padding:10px;display:block;" id="copyText">${response.token}</code>
    <button id="copyButton" type="button" data-clipboard-action="copy" data-clipboard-target="#copyText" style="background:green;color:white;">Copy to Clipboard</button>
    <script>
        new ClipboardJS('#copyButton')
            .on('success', function(e) {
                e.clearSelection();
            })
            .on('error', function(e) {
                e.clearSelection();
                copyText.style.borderColor = 'red';
            });
        copyButton.click();
    </script>
</body></html>`;

pm.visualizer.set(template);

// using navigator.clipboard.writeText() // 使用 navigator.clipboard.writeText()

enter image description here在此处输入图像描述

Here is a sample without using any CDN or library.这是一个不使用任何 CDN 或库的示例。

let template =
`    
    <script>
        pm.getData(function (error, data)
        {
            let textBox = document.createElement('textarea');
            textBox.value = data.key;
            document.body.appendChild(textBox);
            textBox.focus();
            textBox.select();
            document.execCommand('copy');
            document.body.removeChild(textBox);
        });
    </script>
`;

pm.visualizer.set(template, 
    pm.response.json()
);

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM