support mask

node_modules/.yarn-integrity

-{
-  "systemParams": "darwin-x64-72",
-  "modulesFolders": [],
-  "flags": [],
-  "linkedModules": [
-    "@spark/animation",
-    "@spark/api-base",
-    "@spark/api-common",
-    "@spark/common-helpers",
-    "@spark/projectx",
-    "@spark/share",
-    "@spark/ui",
-    "@spark/utils",
-    "alias-parser",
-    "code-mix",
-    "deviljs",
-    "duiba-utils",
-    "fyge",
-    "html-shot",
-    "init-project",
-    "package-readme-generator",
-    "props-compute",
-    "psd-parse-web",
-    "qunity",
-    "qunity-cli",
-    "qunity-pixi",
-    "qunity-scene",
-    "scss-simple-parser",
-    "sheet-packer",
-    "spark-cli",
-    "spark-test-lib",
-    "spark-utils",
-    "spark-wrapper-fyge",
-    "test",
-    "tiny-image",
-    "tree-dsl-react",
-    "visual-code",
-    "visual-process",
-    "zeroing-code-divider",
-    "zeroing-pack",
-    "zeroing-template-fill",
-    "zrender"
-  ],
-  "topLevelPatterns": [],
-  "lockfileEntries": {},
-  "files": [],
-  "artifacts": {}
-}
\ No newline at end of file

package.json

 {
 	"name": "html-shot",
-	"version": "1.0.21",
+	"version": "1.0.22",
 	"main": "dist/index.js",
 	"types": "dist/index.d.ts",
 	"license": "MIT",
 	"scripts": {
 		"dev": "tsc -w",
-		"build": "tsc"
+		"build": "tsc",
+		"release": "npm run build && pvi && npm publish"
+	},
+	"devDependencies": {
+		"package-version-increment": "^1.0.2"
 	}
 }

src/dom-parser.ts

@@ -82,6 +82,7 @@ export function parseDom(el: HTMLElement = document.body) {
 		}
 
 		let styles = getStylesWithoutDefaults(node || childNode, includeStyleKeys)
+		const asMask = styles.overflow === 'auto' || styles.overflow === 'scroll'
 
 		if (!isText) {
 			for (let skey of commonStyleKeys) {
@@ -107,6 +108,11 @@ export function parseDom(el: HTMLElement = document.body) {
 			vNode.width = width
 			vNode.height = height
 
+			if (asMask) {
+				childNode.__maskBegin = true
+				vNode.maskBegin = true
+			}
+
 			for (let skey in styles) {
 				if (styleKeys.indexOf(skey) < 0) {
 					continue
@@ -116,6 +122,13 @@ export function parseDom(el: HTMLElement = document.body) {
 
 			nodes.push(vNode)
 		}
+	}, function (childNode) {
+		if (childNode.__maskBegin) {
+			nodes.push({
+				type: 0,
+				maskEnd: true,
+			})
+		}
 	})
 
 	if (debugMode) {
@@ -129,13 +142,13 @@ export function parseDom(el: HTMLElement = document.body) {
 	}
 }
 
-function walkNode(root, callback) {
-	callback(root)
-
+function walkNode(root, onEnter, onLeave?) {
+	onEnter(root)
 	for (let i = 0, li = root.childNodes.length; i < li; i++) {
 		const childNode = root.childNodes[i]
-		walkNode(childNode, callback)
+		walkNode(childNode, onEnter, onLeave)
 	}
+	onLeave(root)
 }
 
 function getStylesWithoutDefaults(element, includes: string[] = []): any {
@@ -147,7 +160,7 @@ function getStylesWithoutDefaults(element, includes: string[] = []): any {
 
 	let diff = {}
 	for (let key in elementStyles) {
-		if (includes.indexOf(key) >= 0 || (elementStyles.hasOwnProperty(key) && defaultStyles[key] !== elementStyles[key])) {
+		if (includes.indexOf(key) >= 0 || (key in elementStyles && defaultStyles[key] !== elementStyles[key])) {
 			diff[key] = elementStyles[key]
 		}
 	}

test.html

@@ -19,6 +19,8 @@
 			border: 0.1rem solid blue;
 			width: 5.20rem;
 			height: 4.40rem;
+			overflow: scroll;
+			font-size: 0;
 		}
 
 		.bg {
@@ -74,7 +76,7 @@
 <script type="text/babel">
 	ReactDOM.render(
 		<div id="poster" className="poster">
-			<img src="https://th.wallhaven.cc/lg/g7/g75r7d.jpg"/>
+			<img src="https://yun.duiba.com.cn/aurora/assets/2e4adf3d8646ffbd027038cb2c6627a6bca44e44.jpg"/>
 		</div>,
 		document.getElementById('app')
 	);

tsconfig.json

@@ -4,6 +4,7 @@
 		"target": "ES5",
 		"outDir": "dist",
 		"declaration": true,
+		"moduleResolution": "Node",
 		"lib": [
 			"DOM",
 			"ES2015"

yarn.lock

@@ -2,3 +2,28 @@
 # yarn lockfile v1
 
 
+lru-cache@^6.0.0:
+  version "6.0.0"
+  resolved "http://npm.dui88.com:80/lru-cache/-/lru-cache-6.0.0.tgz#6d6fe6570ebd96aaf90fcad1dafa3b2566db3a94"
+  integrity sha1-bW/mVw69lqr5D8rR2vo7JWbbOpQ=
+  dependencies:
+    yallist "^4.0.0"
+
+package-version-increment@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/package-version-increment/-/package-version-increment-1.0.2.tgz#5940f1acfa1eecfcf2e4fea7cd4fb9a678df74bf"
+  integrity sha512-wWCj3rcAnhIK97Qc/H02VedvmGti5MK1N+e31QJiJU4z/mDY6anZWKl71ppX4mFsbqILuETay42RytccczeTRw==
+  dependencies:
+    semver "^7.3.5"
+
+semver@^7.3.5:
+  version "7.3.5"
+  resolved "http://npm.dui88.com:80/semver/-/semver-7.3.5.tgz#0b621c879348d8998e4b0e4be94b3f12e6018ef7"
+  integrity sha1-C2Ich5NI2JmOSw5L6Us/EuYBjvc=
+  dependencies:
+    lru-cache "^6.0.0"
+
+yallist@^4.0.0:
+  version "4.0.0"
+  resolved "http://npm.dui88.com:80/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72"
+  integrity sha1-m7knkNnA7/7GO+c1GeEaNQGaOnI=