websshot
Version:
Simple package to take screenshot of given html or markdown code.
258 lines (186 loc) • 5.71 kB
Markdown
# WebsShot
WebsShot is a simple package that allows you to take screenshot of given HTML code.
# Features
- Simple
- Fast
- Allows you to remove tags, attributes
- Supports markdown
## Preview
# Installing
```sh
npm i --save websshot
```
# Getting started
- Load WebsShot
```js
const WebsShot = require("websshot");
const window = new WebsShot();
```
- Load HTML
```js
window.load("<h1>Hello World</h1>");
```
- Take screenshot
```js
await window.screenshot();
```
- Save as image
```js
let data = await window.screenshot();
fs.writeFileSync("./myimage.png", data);
```
## Basic Example
```js
const WebsShot = require("websshot");
const window = new WebsShot();
const fs = require("fs");
window.load("<h1>Hello World</h1>");
window.screenshot().then((data) => {
fs.writeFileSync("./image.png", data);
});
```
## Using Markdown
```js
const WebsShot = require("websshot");
const window = new WebsShot();
const fs = require("fs");
window.load("# Hello World", true);
window.screenshot().then((data) => {
fs.writeFileSync("./image.png", data);
});
```
## Using both html & markdown
```js
const WebsShot = require("websshot");
const window = new WebsShot();
const fs = require("fs");
window.load("# Hello World<br><br><h2>Goodbye world</h2>", true);
window.screenshot().then((data) => {
fs.writeFileSync("./image.png", data);
});
```
## Removing script tag from the loaded code
(will return blank picture)
```js
const WebsShot = require("websshot");
const window = new WebsShot({
removeTags: ["script"],
});
const fs = require("fs");
window.load("<script>location.href = 'https://youtube.com'</script>");
window.screenshot().then((data) => {
fs.writeFileSync("./image.png", data);
});
```
# API
## WebsShot({ options }, { puppeteerOptions })
Creating a new instance of **WebsShot** allows you to load & capture screenshot.
You can create a new instance using this code:
```js
const WebsShot = require("websshot");
const window = new WebsShot();
```
**WebsShot** accepts these options:
**`options.removeTags`**: This option allows you to remove provided tags before loading the code. Value for this option must be **Array**.
Example:
```js
new WebsShot({
removeTags: ["script"],
});
```
**`options.removeAttributes`**: This option allows you to remove certain attributes from the code. Value for this option must be **Array**.
Example:
```js
new WebsShot({
removeAttributes: ["onload"],
});
```
**`options.height`**: You can set window height here. Value for this option must be **Number**.
Example:
```js
new WebsShot({
height: 800,
});
```
**`options.width`**: You can set window width here. Value for this option must be **Number**.
Example:
```js
new WebsShot({
width: 1280,
});
```
**`puppeteerOptions`**: You can supply options for `puppeteer.launch()` here. Value for this option must be **Object**.
Example:
```js
new WebsShot(
{
width: 1920,
height: 1080,
},
{
args: ["--no-sandbox"],
}
);
```
## WebsShot.setUserAgent(userAgent)
This method allows you to set custom user agent.
## WebsShot.load(code, markdown=false)
This method allows you to load your HTML or Markdown code. Code type must be a **String**.
First parameter takes your code and second parameter takes a **Boolean** value. If second parameter is set to `true`, it will render markdown too.
Example:
```js
const WebsShot = require("websshot");
const window = new WebsShot();
window.load("<h1>Hello World</h1>");
```
## WebsShot.loadFromFile(path, markdown=false)
This method allows you to load your HTML or Markdown code from a file.
First parameter takes your **file path** and second parameter takes a **Boolean** value. If second parameter is set to `true`, it will render markdown too.
Example:
```js
const WebsShot = require("websshot");
const window = new WebsShot();
window.loadFromFile("./index.html");
window.screenshot().then((data) => fs.writeFileSync("./htmltest.png", data));
```
## WebsShot.html()
This method allows you to get the loaded HTML code. It might be different from the original code.
Example:
```js
const WebsShot = require("websshot");
const window = new WebsShot();
window.load("<h1>Hello World</h1>");
console.log(window.html());
```
## WebsShot.screenshot(url=false, options)
This method allows you to take screenshot of any website or the loaded html.
**url** website url. Set it to `false` if you want to capture loaded html. By default, it is `false`.
**options** are the options for **[Puppeteer.PageScreenshotOptions](https://github.com/puppeteer/puppeteer/blob/main/docs/api.md#pagescreenshotoptions)**.
Example:
1. Website
```js
const WebsShot = require("websshot");
const window = new WebsShot();
window
.screenshot("https://youtube.com")
.then((data) => fs.writeFileSync("./youtube.png", data));
```
2. HTML
```js
const WebsShot = require("websshot");
const window = new WebsShot();
window.load("<h1>Hello World</h1>");
window.screenshot().then((data) => fs.writeFileSync("./htmltest.png", data));
```
## WebsShot.version
Current version of **WebsShot**. You may not use this after instantiating **WebsShot** class.
Example:
```js
const WebsShot = require("websshot");
console.log(WebsShot.version);
```
# Created and maintained by
**[Snowflake107](https://github.com/Snowflake107)**
## Join my discord server
**[Snowflake Studio ❄](https://discord.gg/uqB8kxh)**