- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有一个名为 test.html
的框架 html 文件,这是它包含的内容:
<!doctype html>
<html>
<head>
</head>
<body>
</body>
</html>
然后我还有一个文件,目的是在chrome headless中打开上面的文件,在其中添加一个图像,然后截图,看看:
const puppeteer = require('puppeteer')
const fs = require('fs');
(async() => {
const browser = await puppeteer.launch()
const page = await browser.newPage()
await page.goto('file://test.html')
await page.$eval('body', (body) => {
const imgElement = new window.Image()
imgElement.src = 'https://user-images.githubusercontent.com/10379601/29446482-04f7036a-841f-11e7-9872-91d1fc2ea683.png'
body.appendChild(imgElement)
})
await page.waitForSelector('img')
fs.writeFileSync('output.html', await page.content())
await page.screenshot({
path: 'screenshot.jpg'
})
await browser.close()
})()
运行此代码后,我得到一个空图像文件作为屏幕截图。您还可以注意到,我使用以下方法转储页面内容:
fs.writeFileSync('output.html', await page.content())
在我的浏览器中打开 output.html
包含我在屏幕截图中期望的图像。为什么生成的截图是空的?
最佳答案
这是因为您没有等待图片下载。您只在等待 await page.waitForSelector('img')
但这个等待的是 DOM 元素,而不是实际图像。这是图像下载和截图之间的竞争条件。您应该像这样等待图像 onload
:
await page.$eval('body', async (body) => {
const imgElement = new window.Image()
imgElement.src = 'https://user-images.githubusercontent.com/10379601/29446482-04f7036a-841f-11e7-9872-91d1fc2ea683.png'
body.appendChild(imgElement)
await new Promise(resolve => {
imgElement.onload = resolve;
});
});
关于javascript - 无法使用 puppeteer 截取屏幕截图,它会转储一个空图像文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48008678/
下面是split截取获得 ? 1
我正在写一个小编辑。我想更改 QTextEdit 的默认行为,即在 Tab 时插入制表符被击中。相反,我想放 4 个空格。这样做的推荐方法是什么?我想关于子类化 keyPressedEvent ,但也
我正在寻找一种简单的方法来在我的 ASP 页面中截取 iFrame 的屏幕截图。我只是无法用 C# 实现它,而且我缺乏 Javascript 知识!有没有人知道实现这一目标的简单和最佳方法? 我正在尝
这让我感到困惑。 DirectX 绕过所有内容并直接与设备驱动程序对话,因此 GDI 和其他常用方法将不起作用 - 除非 Aero 被禁用(或不可用),否则出现的只是屏幕左上角的黑色矩形。我已经尝试了
我正在开发一个应用程序,当我按下按钮时,我想发送 2 个 View 的 2 个屏幕截图,并将其附加到电子邮件中。 这两个 View Controller 被称为 secondViewControlle
我尝试截取一个用 WPF 编写的应用程序,但应用程序没有被捕获,我是否必须使用特殊工具来截取屏幕截图? 最佳答案 您可以使用 RenderTargetBitmap从 WPF 控件生成图像。 p
以下是我的断言。 Assert.assertEquals(securityQuestionPage.UserName.getText().toString(),BaseClass.unsuccessf
我有一个 ImageView @property (strong, nonatomic) IBOutlet UIImageView *imageView; 我想截图。我的代码占据了整个屏幕。我已经查看
我必须编写一些 javascript 代码来截取网页的屏幕截图,但不能在前台渲染它。首先,这可能吗?我需要使用一些外部库吗?请给我一些想法:) 最佳答案 如果您正在谈论在 Firefox chrome
我想在我的 tableview 屏幕截图图像中包含导航栏。以下代码用于捕获整个 TableView ,我尝试了其他代码来捕获导航栏而不是整个 TableView 。可以同时进行吗? func scre
我使用以下代码截取我的 View : UIGraphicsBeginImageContextWithOptions(containerView.bounds.size, NO, [[UIScreen
我正在开发一个简单的相机应用程序。我有截取整个 Activity 的屏幕截图并将其写入 SD 卡的代码。问题是 Surfaceview 返回黑屏。 我想知道如何独立截取surfaceview的截图。这
基本上我想做的是: 我在页面上有一个 flash 游戏(例如 pacman) 我希望能够使用 javascript 打印该游戏的屏幕 这可能吗?我知道我可以将游戏 swf 包含在另一个 swf 中并使
我正在开发的应用程序使用 Collection View 单元格向用户显示数据。我希望用户能够共享单元格中包含的数据,但通常有太多单元格无法尝试调整大小并适合单个 iPhone 屏幕大小的窗口并获取屏
有人可以分享代码来截取网络浏览器控件的屏幕截图并将其保存在预定路径中。 我正在使用 VS 2008 .Net 3.5。 最佳答案 你可以使用 Control.DrawToBitmap() ,即使它在
在 String 中提供了两个截取字符串的方法,一个是从指定位置截取到字符串结尾,另一个是截取指定范围的内容。下面对这两种方法分别进行介绍。 1. substring(int beginIndex
如下所示: ? 1
MySQL字符串的拼接、截取、替换、查找位置。 常用的字符串函数: 函数 说明 CONCAT(s1,s2,...)
我想截取UIView(该 View 将包含签名)并将其保存到应用程序文件中的本地文件中,以便以后调用图像点显示在类似于 UIImageView 的内容中。下面是签名 UIView 背后的代码。 #im
下面的代码是截取当前页面的屏幕截图。 html2canvas中的url可以截图吗?我的意思是我有一个 URL 是 mydomain.com/home mydomain.com/home?id=2 my
我是一名优秀的程序员,十分优秀!