Compare commits

..

25 Commits

Author SHA1 Message Date
CI
b89458611b chore(release): 1.0.0-rc.1 2019-04-10 03:43:30 +00:00
4e4a231683 fix: safari data url taints (#1797) 2019-04-09 20:32:22 -07:00
a63cb3c0f1 ci: add ios simulator tests (#1794) 2019-04-08 21:56:22 -07:00
7775d3c0d6 docs: remove invalid async option from docs (fix #1769) (#1796) 2019-04-07 22:16:29 -07:00
397595afb5 fix: don't apply text shadows on elements (#1795)
* Fix for Issue-1638 (https://github.com/niklasvh/html2canvas/issues/1638)
Resolution: Clearing the Shadow Properties after they are consumed
2019-04-07 21:36:14 -07:00
7027900f49 fix: context scale for high resolution displays with foreignobjectrendering (#1782) 2019-04-07 16:49:29 -07:00
49f87fb680 test: fix RefTestRenderer.js inclusion with karma 2019-04-07 15:08:23 -07:00
238de790a9 docs: fix release date in changelog 2019-04-07 15:03:14 -07:00
CI
029235a652 chore(release): 1.0.0-rc.0 2019-04-07 22:01:14 +00:00
44f3d79f68 build: update webpack and babel (#1793) 2019-04-07 14:24:17 -07:00
7ebef72e92 ci: automate changelog generation (#1792) 2019-04-07 12:49:10 -07:00
2c018d1987 fix: wrap .sheet.cssRules access in try...catch. (#1693) 2019-04-07 12:17:43 -07:00
5cbe5db351 fix: prevent unhandled promise rejections for hidden frames (#1762) 2019-04-06 23:44:01 -07:00
3212184146 docs: improve canvas size limit documentation (#1576) 2019-04-06 23:36:29 -07:00
349bbf137a fix: enforce colorstop min 0 (#1743) 2019-04-06 23:24:07 -07:00
c45ef099fe ci: Improve CI pipeline (#1790) 2019-04-06 23:07:52 -07:00
24823d0491 Upgrade gatsbyjs to v2 2019-04-05 21:28:45 -07:00
41eb8ab22f Add support for ES and browser bundlers (#1534) 2018-07-06 23:03:14 +08:00
4e02a4c7a1 Remove unintended space (#1501) 2018-07-06 23:02:50 +08:00
ce45c1bbdd Update proxy version 2018-07-06 22:55:59 +08:00
078b388974 Update mocha 2018-07-06 22:55:11 +08:00
3ae7dd2ebb Flow ignore rollup config 2018-07-06 22:39:35 +08:00
dab77acde4 Update package-lock.json 2018-07-06 22:31:13 +08:00
83e7eaa795 Fix type import 2018-07-06 22:28:48 +08:00
cb7fbcf33e Begin implementing rollup 2018-07-06 22:28:30 +08:00
43 changed files with 21463 additions and 11322 deletions

View File

@ -1,4 +1,13 @@
{
"plugins": ["transform-object-rest-spread"],
"presets": ["es2015", "flow"]
"presets": [[
"@babel/preset-env",
{
"targets": {
"ie": "9"
}
}
], "@babel/preset-flow"],
"plugins": [
"add-module-exports"
]
}

View File

@ -11,7 +11,7 @@ insert_final_newline = true
indent_style = space
indent_size = 4
[{.travis.yml,package.json}]
[{azure-pipelines.yml,package.json}]
# The indent size used in the `package.json` file cannot be changed
# https://github.com/npm/npm/pull/3180#issuecomment-16336516
indent_size = 2

View File

@ -1,5 +1,6 @@
[ignore]
.*/www/.*
.*/node_modules/@webassemblyjs/.*
[include]
[libs]
./flow-typed

1
.gitignore vendored
View File

@ -1,4 +1,5 @@
/dist
/tmp
/build
/nbproject/
image.jpg

View File

@ -5,6 +5,7 @@ scripts/
src/
tests/
www/
tmp/
.github/
*.iml
.babelrc
@ -13,6 +14,8 @@ www/
.npmignore
.eslintrc
.travis.yml
azure-pipelines.yml
karma.js
karma.conf.js
rollup.config.js
webpack.config.js

View File

@ -1,57 +0,0 @@
language: node_js
node_js:
- '7'
env:
global:
- secure: eW41gIqOizwO4pTgWnAAbW75AP7F+CK9qfSed/fSh4sJ9HWMIY1YRIaY8gjr+6jV/f7XVHcXuym6ZxgINYSkVKbF1JKxBJNLOXtSgNbVHSic58pYFvUjwxIBI9aPig9uux1+DbnpWqXFDTcACJSevQZE0xwmjdrSkDLgB0G34v8=
- secure: Y2Av+Gd3z9uQEB36GwdOOuGka0hx0/HeitASEo59z934O8RxnmN9eNTXS7dDT3XtKtwxIyLTOEpS7qlRdWahH28hr/dS4xJj6ao58C+1xMcDs6NAPGmDxUlcJWpcGEsnjmXjQCc3fBioSTdpIBrK/gdvgpNh77UKG74Sk7Z+YGk=
addons:
chrome: stable
firefox: latest
dist: trusty
sudo: true
before_script:
- export DISPLAY=:99.0
- sh -e /etc/init.d/xvfb start
notifications:
webhooks:
urls:
- https://webhooks.gitter.im/e/2b007d4f86de89588804
on_success: always
on_failure: always
on_start: false
script:
- npm run build
- cd www && npm install && npm run build && cd ..
- npm test
deploy:
- provider: npm
email: niklasvh@gmail.com
api_key:
secure: G/Szpr8q4/D6hp+H/Z9yyluUXtHAwf7LLa1Y07X59/Enlj1h7V5fQ7AW4/iAVM3XbIsrCPWR3dJU9g/ZxpxFg4OovIHVpS2Jr/mahtPYWdHR3pWuSmMW8QD+Twnq2VAFwSgg5Oumq3QxhX3YbCOnZox6+6Uviqk8FO7Z5B0RwW4=
skip_cleanup: true
on:
tags: true
branch: master
repo: niklasvh/html2canvas
- provider: releases
api_key:
secure: "PowO/Jat660k3gHcjgI6DlJz15RM7pLUu11UPsLCtYJ8ZwodppE6Keg0DfVkSFSIZttZor+UssDwP/WOEqfZNLqmXbcj3Gec4xolohet/GOe0KJKKuF/HgggbcxumopxMX6sMVePlMBpkLpHh7tgEAEHBWTlzC1c1a7Xa48fZ7k="
file:
- "dist/html2canvas.js"
- "dist/html2canvas.min.js"
skip_cleanup: true
on:
tags: true
branch: master
repo: niklasvh/html2canvas
- provider: pages
skip_cleanup: true
local_dir: www/public
target_branch: gh-pages
fqdn: html2canvas.hertzen.com
github_token:
secure: "PowO/Jat660k3gHcjgI6DlJz15RM7pLUu11UPsLCtYJ8ZwodppE6Keg0DfVkSFSIZttZor+UssDwP/WOEqfZNLqmXbcj3Gec4xolohet/GOe0KJKKuF/HgggbcxumopxMX6sMVePlMBpkLpHh7tgEAEHBWTlzC1c1a7Xa48fZ7k="
on:
branch: master
repo: niklasvh/html2canvas

View File

@ -1,64 +1,114 @@
### Changelog ###
# Change Log
#### v1.0.0-alpha.12 - 5.4.2018 ####
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
# [1.0.0-rc.1](https://github.com/niklasvh/html2canvas/compare/v1.0.0-rc.0...v1.0.0-rc.1) (2019-04-10)
### ci
* add ios simulator tests (#1794) ([a63cb3c0f132b1af915d9ef55a4c174f6e5502ce](https://github.com/niklasvh/html2canvas/commit/a63cb3c0f132b1af915d9ef55a4c174f6e5502ce)), closes [#1794](https://github.com/niklasvh/html2canvas/issues/1794)
### docs
* fix release date in changelog ([238de790a9f223becbc8726633c0f2a2dabf2cb7](https://github.com/niklasvh/html2canvas/commit/238de790a9f223becbc8726633c0f2a2dabf2cb7))
* remove invalid `async` option from docs (fix #1769) (#1796) ([7775d3c0d6f3efca00611bedd5fc9200689a9f7a](https://github.com/niklasvh/html2canvas/commit/7775d3c0d6f3efca00611bedd5fc9200689a9f7a)), closes [#1769](https://github.com/niklasvh/html2canvas/issues/1769) [#1796](https://github.com/niklasvh/html2canvas/issues/1796)
### fix
* context scale for high resolution displays with foreignobjectrendering (#1782) ([7027900f4993dcd00745a4db045ed1c0e3255f8a](https://github.com/niklasvh/html2canvas/commit/7027900f4993dcd00745a4db045ed1c0e3255f8a)), closes [#1782](https://github.com/niklasvh/html2canvas/issues/1782)
* don't apply text shadows on elements (#1795) ([397595afb59ee50f0d128abb5945b5b9ddc6650d](https://github.com/niklasvh/html2canvas/commit/397595afb59ee50f0d128abb5945b5b9ddc6650d)), closes [#1795](https://github.com/niklasvh/html2canvas/issues/1795)
* safari data url taints (#1797) ([4e4a231683904dfdc1f82472ece5a160a158dbb8](https://github.com/niklasvh/html2canvas/commit/4e4a231683904dfdc1f82472ece5a160a158dbb8)), closes [#1797](https://github.com/niklasvh/html2canvas/issues/1797)
### test
* fix RefTestRenderer.js inclusion with karma ([49f87fb680dbfe1898b3aeb60f2f5c3a93bfbe6d](https://github.com/niklasvh/html2canvas/commit/49f87fb680dbfe1898b3aeb60f2f5c3a93bfbe6d))
# [1.0.0-rc.0](https://github.com/niklasvh/html2canvas/compare/v1.0.0-alpha.12...v1.0.0-rc.0) (2019-04-07)
### build
* update webpack and babel (#1793) ([44f3d79f68836624c2673a86f9ad47c17ef843c3](https://github.com/niklasvh/html2canvas/commit/44f3d79f68836624c2673a86f9ad47c17ef843c3)), closes [#1793](https://github.com/niklasvh/html2canvas/issues/1793)
### ci
* automate changelog generation (#1792) ([7ebef72e927eaafd34a1792ece431d2a73109230](https://github.com/niklasvh/html2canvas/commit/7ebef72e927eaafd34a1792ece431d2a73109230)), closes [#1792](https://github.com/niklasvh/html2canvas/issues/1792)
* Improve CI pipeline (#1790) ([c45ef099fe8f7142e174f4fce39448a370a987d5](https://github.com/niklasvh/html2canvas/commit/c45ef099fe8f7142e174f4fce39448a370a987d5)), closes [#1790](https://github.com/niklasvh/html2canvas/issues/1790)
### docs
* improve canvas size limit documentation (#1576) ([3212184146b33c3564c2f416e1bfda911737c38b](https://github.com/niklasvh/html2canvas/commit/3212184146b33c3564c2f416e1bfda911737c38b)), closes [#1576](https://github.com/niklasvh/html2canvas/issues/1576)
### fix
* enforce colorstop min 0 (#1743) ([349bbf137abd83464e074db3948fc79a541c2ef3](https://github.com/niklasvh/html2canvas/commit/349bbf137abd83464e074db3948fc79a541c2ef3)), closes [#1743](https://github.com/niklasvh/html2canvas/issues/1743)
* prevent unhandled promise rejections for hidden frames (#1762) ([5cbe5db35155e3a9790a30de09feb17843053b7a](https://github.com/niklasvh/html2canvas/commit/5cbe5db35155e3a9790a30de09feb17843053b7a)), closes [#1762](https://github.com/niklasvh/html2canvas/issues/1762)
* wrap .sheet.cssRules access in try...catch. (#1693) ([2c018d19875ced30caafdc40f84ca531de6e6f91](https://github.com/niklasvh/html2canvas/commit/2c018d19875ced30caafdc40f84ca531de6e6f91)), closes [#1693](https://github.com/niklasvh/html2canvas/issues/1693)
# [1.0.0-alpha.12](https://github.com/niklasvh/html2canvas/compare/v1.0.0-alpha.12...v1.0.0-alpha.13) (2018-04-05)
* Fix white space appearing on element rendering (Fix #1438)
* Reset canvas transform on finish (Fix #1494)
#### v1.0.0-alpha.11 - 1.4.2018 ####
# v1.0.0-alpha.11 - 1.4.2018
* Fix IE11 member not found error
* Support blob image resources in non-foreignObjectRendering mode
#### v1.0.0-alpha.10 - 15.2.2018 ####
# v1.0.0-alpha.10 - 15.2.2018
* Re-introduce `onclone` option (Fix #1434)
* Add `ignoreElements` predicate function option
* Fix version console logging
#### v1.0.0-alpha.9 - 7.1.2018 ####
# v1.0.0-alpha.9 - 7.1.2018
* Fix dynamic style sheets
* Fix > 50% border-radius values
#### v1.0.0-alpha.8 - 2.1.2018 ####
# v1.0.0-alpha.8 - 2.1.2018
* Use correct doctype in cloned Document (Fix #1298)
* Fix individual border rendering (Fix #1349)
#### v1.0.0-alpha.7 - 31.12.2017 ####
# v1.0.0-alpha.7 - 31.12.2017
* Fix form input rendering (#1338)
* Improve word line breaking algorithm
#### v1.0.0-alpha.6 - 28.12.2017 ####
# v1.0.0-alpha.6 - 28.12.2017
* Fix list-style: none (#1340)
* Extend supported values for pseudo element content
#### v1.0.0-alpha.5 - 21.12.2017 ####
# v1.0.0-alpha.5 - 21.12.2017
* Fix underline positioning
* Fix canvas rendering on Chrome
* Fix overflow: auto
* Added support for rendering list-style
#### v1.0.0-alpha.4 - 12.12.2017 ####
v1.0.0-alpha.4 - 12.12.2017
* Fix rendering with multiple fonts defined (Fix #796)
* Add support for radial-gradients
* Fix logging option (#1302)
* Add support for rendering webgl canvas content (#646)
* Fix external SVG loading with proxies (#802)
#### v1.0.0-alpha.3 - 9.12.2017 ####
# v1.0.0-alpha.3 - 9.12.2017
* Disable `foreignObjectRendering` by default (#1295)
* Fix background-size when using background-origin and background-size: cover/contain (#1299)
* Added support for background-origin: content-box (#1299)
#### v1.0.0-alpha.2 - 7.12.2017 ####
# v1.0.0-alpha.2 - 7.12.2017
* Fix scroll positions for CanvasRenderer (#1259)
* Fix `data-html2canvas-ignore` attribute (#1253)
* Fix decimal `letter-spacing` values (#1293)
#### v1.0.0-alpha.1 - 5.12.2017 ####
# v1.0.0-alpha.1 - 5.12.2017
* Complete rewrite of library
##### Breaking Changes #####
* Remove deprecated onrendered callback, calling `html2canvas` returns a `Promise<HTMLCanvasElement>`
* Removed option `type`, same results can be achieved by assigning `x`, `y`, `scrollX`, `scrollY`, `width` and `height` properties.
##### New featues / fixes #####
## New featues / fixes
* Add support for scaling canvas (defaults to device pixel ratio)
* Add support for multiple text-shadows
* Add support for multiple text-decorations
@ -68,18 +118,18 @@
* Correctly support all angle types for linear-gradients
* Add support for multiple values for background-repeat, background-position and background-size
#### v0.5.0-beta4 - 23.1.2016 ####
# v0.5.0-beta4 - 23.1.2016
* Fix logger requiring access to window object
* Derequire browserify build
* Fix rendering of specific elements when window is scrolled and `type` isn't set to `view`
#### v0.5.0-beta3 - 6.12.2015 ####
# v0.5.0-beta3 - 6.12.2015
* Handle color names in linear gradients
#### v0.5.0-beta2 - 20.10.2015 ####
# v0.5.0-beta2 - 20.10.2015
* Remove Promise polyfill (use native or provide it yourself)
#### v0.5.0-beta1 - 19.10.2015 ####
# v0.5.0-beta1 - 19.10.2015
* Fix bug with unmatched color stops in gradients
* Fix scrolling issues with iOS
* Correctly handle named colors in gradients
@ -87,11 +137,11 @@
* Fix transparent colors breaking gradients
* Preserve scrolling positions on render
#### v0.5.0-alpha2 - 3.2.2015 ####
# v0.5.0-alpha2 - 3.2.2015
* Switch to using browserify for building
* Fix (#517) Chrome stretches background images with 'auto' or single attributes
#### v0.5.0-alpha - 19.1.2015####
# v0.5.0-alpha - 19.1.2015
* Complete rewrite of library
* Switched interface to return Promise
* Uses hidden iframe window to perform rendering, allowing async rendering and doesn't force the viewport to be scrolled to the top anymore.
@ -102,14 +152,14 @@
* Changed format for proxy requests, permitting binary responses with CORS headers as well
* Fixed many layering issues (see z-index tests)
#### v0.4.1 - 7.9.2013 ####
# v0.4.1 - 7.9.2013
* Added support for bower
* Improved z-index ordering
* Basic implementation for CSS transformations
* Fixed inline text in top element
* Basic implementation for text-shadow
#### v0.4.0 - 30.1.2013 ####
# v0.4.0 - 30.1.2013
* Added rendering tests with <a href="https://github.com/niklasvh/webdriver.js">webdriver</a>
* Switched to using grunt for building
* Removed support for IE<9, including any FlashCanvas bits
@ -119,7 +169,7 @@
* Support for placeholder rendering
* Reformatted all tests to small units to test specific features
#### v0.3.4 - 26.6.2012 ####
# v0.3.4 - 26.6.2012
* Removed (last?) jQuery dependencies (<a href="https://github.com/niklasvh/html2canvas/commit/343b86705fe163766fcf735eb0217130e4bd5b17">niklasvh</a>)
* SVG-powered rendering (<a href="https://github.com/niklasvh/html2canvas/commit/67d3e0d0f59a5a654caf71a2e3be6494ff146c75">niklasvh</a>)
@ -127,7 +177,7 @@
* Split renderers to their own objects (<a href="https://github.com/niklasvh/html2canvas/commit/94f2f799a457cd29a21cc56ef8c06f1697866739">niklasvh</a>)
* Simplified API, cleaned up code (<a href="https://github.com/niklasvh/html2canvas/commit/c7d526c9eaa6a4abf4754d205fe1dee360c7660e">niklasvh</a>)
#### v0.3.3 - 2.3.2012 ####
# v0.3.3 - 2.3.2012
* SVG taint fix, and additional taint testing options for rendering (<a href="https://github.com/niklasvh/html2canvas/commit/2dc8b9385e656696cb019d615bdfa1d98b17d5d4">niklasvh</a>)
* Added support for CORS images and option to create canvas as tainted (<a href="https://github.com/niklasvh/html2canvas/commit/3ad49efa0032cde25c6ed32a39e35d1505d3b2ef">niklasvh</a>)
@ -135,7 +185,7 @@
* Added integrated support for Flashcanvas (<a href="https://github.com/niklasvh/html2canvas/commit/e9257191519f67d74fd5e364d8dee3c0963ba5fc">niklasvh</a>)
* Fixed a variety of legacy IE bugs (<a href="https://github.com/niklasvh/html2canvas/commit/b65357c55d0701017bafcd357bc654b54d458f8f">niklasvh</a>)
#### v0.3.2 - 20.2.2012 ####
# v0.3.2 - 20.2.2012
* Added changelog!
* Added bookmarklet (<a href="https://github.com/niklasvh/html2canvas/commit/b320dd306e1a2d32a3bc5a71b6ebf6d8c060cde5">cobexer</a>)

View File

@ -4,7 +4,7 @@ html2canvas
[Homepage](https://html2canvas.hertzen.com) | [Downloads](https://github.com/niklasvh/html2canvas/releases) | [Questions](http://stackoverflow.com/questions/tagged/html2canvas?sort=newest) | [Donate](https://www.gittip.com/niklasvh/)
[![Gitter](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/niklasvh/html2canvas?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge)
[![Build Status](https://travis-ci.org/niklasvh/html2canvas.svg)](https://travis-ci.org/niklasvh/html2canvas)
[![Build Status](https://dev.azure.com/niklasvh/html2canvas/_apis/build/status/niklasvh.html2canvas?branchName=master)](https://dev.azure.com/niklasvh/html2canvas/_build/latest?definitionId=1&branchName=master)
[![NPM Downloads](https://img.shields.io/npm/dm/html2canvas.svg)](https://www.npmjs.org/package/html2canvas)
[![NPM Version](https://img.shields.io/npm/v/html2canvas.svg)](https://www.npmjs.org/package/html2canvas)

430
azure-pipelines.yml Normal file
View File

@ -0,0 +1,430 @@
trigger:
- master
jobs:
- job: Build
displayName: Build
pool:
vmImage: 'Ubuntu-16.04'
steps:
- task: NodeTool@0
inputs:
versionSpec: '10.x'
displayName: 'Install Node.js'
- task: Npm@0
inputs:
command: install
- script: npm run build
displayName: Build
- script: |
npm pack
mv html2canvas-*.tgz html2canvas.tgz
tar --list --verbose --file=html2canvas.tgz
displayName: Pack
name: pack
- task: PublishBuildArtifacts@1
inputs:
PathtoPublish: html2canvas.tgz
artifactName: npm
- task: PublishBuildArtifacts@1
inputs:
PathtoPublish: 'dist'
artifactName: dist
- task: PublishBuildArtifacts@1
inputs:
PathtoPublish: 'build'
artifactName: build
- job: Test
displayName: Tests
pool:
vmImage: 'Ubuntu-16.04'
steps:
- task: NodeTool@0
inputs:
versionSpec: '10.x'
displayName: 'Install Node.js'
- task: Npm@0
inputs:
command: install
- script: npm run build
displayName: Build
- script: npm run lint
displayName: Lint
- script: npm run flow
displayName: Flow
- script: npm run test:node
displayName: Unit tests
- job: Build_docs
displayName: Build docs
pool:
vmImage: 'Ubuntu-16.04'
steps:
- task: NodeTool@0
inputs:
versionSpec: '10.x'
displayName: 'Install Node.js'
- task: Npm@0
inputs:
command: install
- script: npm run build && cd www && npm install && npm run build && cd ..
displayName: Build docs
- task: PublishBuildArtifacts@1
displayName: Upload docs website artifact
inputs:
PathtoPublish: 'www/public'
artifactName: docs
- job: Browser_Tests_Linux_Firefox_Stable
displayName: Linux Firefox Stable
pool:
vmImage: 'Ubuntu-16.04'
variables:
TARGET_BROWSER: Firefox_Stable
dependsOn: Build
condition: succeeded()
steps:
- task: NodeTool@0
inputs:
versionSpec: '10.x'
displayName: 'Install Node.js'
- task: Npm@0
inputs:
command: install
- task: DownloadBuildArtifacts@0
displayName: 'Download library'
inputs:
artifactName: dist
downloadPath: $(System.DefaultWorkingDirectory)
- task: DownloadBuildArtifacts@0
displayName: 'Download testrunner'
inputs:
artifactName: build
downloadPath: $(System.DefaultWorkingDirectory)
- script: Xvfb :99 &
displayName: 'Start Xvfb'
- script: DISPLAY=:99 npm run karma
displayName: 'Run Firefox tests - Firefox Stable'
- task: PublishTestResults@2
condition: succeededOrFailed()
inputs:
testRunner: JUnit
testResultsFiles: 'tmp/junit/*.xml'
- task: PublishBuildArtifacts@1
displayName: Upload Screenshots
condition: succeededOrFailed()
inputs:
PathtoPublish: 'tmp/reftests'
artifactName: ReftestResults
- job: Browser_Tests_Linux_Chrome_Stable
displayName: Linux Chrome Stable
pool:
vmImage: 'Ubuntu-16.04'
variables:
TARGET_BROWSER: Chrome_Stable
dependsOn: Build
condition: succeeded()
steps:
- task: NodeTool@0
inputs:
versionSpec: '10.x'
displayName: 'Install Node.js'
- task: Npm@0
inputs:
command: install
- task: DownloadBuildArtifacts@0
displayName: 'Download library'
inputs:
artifactName: dist
downloadPath: $(System.DefaultWorkingDirectory)
- task: DownloadBuildArtifacts@0
displayName: 'Download testrunner'
inputs:
artifactName: build
downloadPath: $(System.DefaultWorkingDirectory)
- script: Xvfb :99 &
displayName: 'Start Xvfb'
- script: DISPLAY=:99 npm run karma
displayName: 'Run Chrome tests - Chrome Stable'
- task: PublishTestResults@2
condition: succeededOrFailed()
inputs:
testRunner: JUnit
testResultsFiles: 'tmp/junit/*.xml'
- task: PublishBuildArtifacts@1
displayName: Upload Screenshots
condition: succeededOrFailed()
inputs:
PathtoPublish: 'tmp/reftests'
artifactName: ReftestResults
- job: Browser_Tests_OSX_Safari_IOS_9
displayName: iOS Simulator Safari 9
pool:
vmImage: 'macOS-10.13'
variables:
TARGET_BROWSER: Safari_IOS_9
dependsOn: Build
condition: succeeded()
steps:
- task: NodeTool@0
inputs:
versionSpec: '10.x'
displayName: 'Install Node.js'
- task: Npm@0
inputs:
command: install
- task: DownloadBuildArtifacts@0
displayName: 'Download library'
inputs:
artifactName: dist
downloadPath: $(System.DefaultWorkingDirectory)
- task: DownloadBuildArtifacts@0
displayName: 'Download testrunner'
inputs:
artifactName: build
downloadPath: $(System.DefaultWorkingDirectory)
- script: npm run karma
displayName: 'Run Safari tests - Safari IOS'
- task: PublishTestResults@2
condition: succeededOrFailed()
inputs:
testRunner: JUnit
testResultsFiles: 'tmp/junit/*.xml'
- task: PublishBuildArtifacts@1
displayName: Upload Screenshots
condition: succeededOrFailed()
inputs:
PathtoPublish: 'tmp/reftests'
artifactName: ReftestResults
- job: Browser_Tests_OSX_Safari_IOS_10
displayName: iOS Simulator Safari 10
pool:
vmImage: 'macOS-10.13'
variables:
TARGET_BROWSER: Safari_IOS_10
dependsOn: Build
condition: succeeded()
steps:
- task: NodeTool@0
inputs:
versionSpec: '10.x'
displayName: 'Install Node.js'
- task: Npm@0
inputs:
command: install
- task: DownloadBuildArtifacts@0
displayName: 'Download library'
inputs:
artifactName: dist
downloadPath: $(System.DefaultWorkingDirectory)
- task: DownloadBuildArtifacts@0
displayName: 'Download testrunner'
inputs:
artifactName: build
downloadPath: $(System.DefaultWorkingDirectory)
- script: npm run karma
displayName: 'Run Safari tests - Safari IOS'
- task: PublishTestResults@2
condition: succeededOrFailed()
inputs:
testRunner: JUnit
testResultsFiles: 'tmp/junit/*.xml'
- task: PublishBuildArtifacts@1
displayName: Upload Screenshots
condition: succeededOrFailed()
inputs:
PathtoPublish: 'tmp/reftests'
artifactName: ReftestResults
- job: Browser_Tests_OSX_Safari_IOS_11
displayName: iOS Simulator Safari 11
pool:
vmImage: 'macOS-10.13'
variables:
TARGET_BROWSER: Safari_IOS_11
dependsOn: Build
condition: succeeded()
steps:
- task: NodeTool@0
inputs:
versionSpec: '10.x'
displayName: 'Install Node.js'
- task: Npm@0
inputs:
command: install
- task: DownloadBuildArtifacts@0
displayName: 'Download library'
inputs:
artifactName: dist
downloadPath: $(System.DefaultWorkingDirectory)
- task: DownloadBuildArtifacts@0
displayName: 'Download testrunner'
inputs:
artifactName: build
downloadPath: $(System.DefaultWorkingDirectory)
- script: npm run karma
displayName: 'Run Safari tests - Safari IOS'
- task: PublishTestResults@2
condition: succeededOrFailed()
inputs:
testRunner: JUnit
testResultsFiles: 'tmp/junit/*.xml'
- task: PublishBuildArtifacts@1
displayName: Upload Screenshots
condition: succeededOrFailed()
inputs:
PathtoPublish: 'tmp/reftests'
artifactName: ReftestResults
- job: Browser_Tests_OSX_Safari_Stable
displayName: OSX Safari Stable
pool:
vmImage: 'macOS-10.13'
variables:
TARGET_BROWSER: Safari_Stable
dependsOn: Build
condition: succeeded()
steps:
- task: NodeTool@0
inputs:
versionSpec: '10.x'
displayName: 'Install Node.js'
- task: Npm@0
inputs:
command: install
- task: DownloadBuildArtifacts@0
displayName: 'Download library'
inputs:
artifactName: dist
downloadPath: $(System.DefaultWorkingDirectory)
- task: DownloadBuildArtifacts@0
displayName: 'Download testrunner'
inputs:
artifactName: build
downloadPath: $(System.DefaultWorkingDirectory)
- script: npm run karma
displayName: 'Run Safari tests - Safari Stable'
- task: PublishTestResults@2
condition: succeededOrFailed()
inputs:
testRunner: JUnit
testResultsFiles: 'tmp/junit/*.xml'
- task: PublishBuildArtifacts@1
displayName: Upload Screenshots
condition: succeededOrFailed()
inputs:
PathtoPublish: 'tmp/reftests'
artifactName: ReftestResults
- job: Browser_Tests_Windows_IE9
displayName: Windows Internet Explorer 9 (Emulated)
pool:
vmImage: 'vs2017-win2016'
variables:
TARGET_BROWSER: IE_9
dependsOn: Build
condition: succeeded()
steps:
- task: NodeTool@0
inputs:
versionSpec: '10.x'
displayName: 'Install Node.js'
- task: Npm@0
inputs:
command: install
- task: DownloadBuildArtifacts@0
displayName: 'Download library'
inputs:
artifactName: dist
downloadPath: $(System.DefaultWorkingDirectory)
- task: DownloadBuildArtifacts@0
displayName: 'Download testrunner'
inputs:
artifactName: build
downloadPath: $(System.DefaultWorkingDirectory)
- script: npm run karma
displayName: 'Run Internet Explorer tests - IE 9'
- task: PublishTestResults@2
condition: succeededOrFailed()
inputs:
testRunner: JUnit
testResultsFiles: 'tmp/junit/*.xml'
- task: PublishBuildArtifacts@1
displayName: Upload Screenshots
condition: succeededOrFailed()
inputs:
PathtoPublish: 'tmp/reftests'
artifactName: ReftestResults
- job: Browser_Tests_Windows_IE10
displayName: Windows Internet Explorer 10 (Emulated)
pool:
vmImage: 'vs2017-win2016'
variables:
TARGET_BROWSER: IE_10
dependsOn: Build
condition: succeeded()
steps:
- task: NodeTool@0
inputs:
versionSpec: '10.x'
displayName: 'Install Node.js'
- task: Npm@0
inputs:
command: install
- task: DownloadBuildArtifacts@0
displayName: 'Download library'
inputs:
artifactName: dist
downloadPath: $(System.DefaultWorkingDirectory)
- task: DownloadBuildArtifacts@0
displayName: 'Download testrunner'
inputs:
artifactName: build
downloadPath: $(System.DefaultWorkingDirectory)
- script: npm run karma
displayName: 'Run Internet Explorer tests - IE 10'
- task: PublishTestResults@2
condition: succeededOrFailed()
inputs:
testRunner: JUnit
testResultsFiles: 'tmp/junit/*.xml'
- task: PublishBuildArtifacts@1
displayName: Upload Screenshots
condition: succeededOrFailed()
inputs:
PathtoPublish: 'tmp/reftests'
artifactName: ReftestResults
- job: Browser_Tests_Windows_IE11
displayName: Windows Internet Explorer 11
pool:
vmImage: 'vs2017-win2016'
variables:
TARGET_BROWSER: IE_11
dependsOn: Build
condition: succeeded()
steps:
- task: NodeTool@0
inputs:
versionSpec: '10.x'
displayName: 'Install Node.js'
- task: Npm@0
inputs:
command: install
- task: DownloadBuildArtifacts@0
displayName: 'Download library'
inputs:
artifactName: dist
downloadPath: $(System.DefaultWorkingDirectory)
- task: DownloadBuildArtifacts@0
displayName: 'Download testrunner'
inputs:
artifactName: build
downloadPath: $(System.DefaultWorkingDirectory)
- script: npm run karma
displayName: 'Run Internet Explorer tests - IE 11'
- task: PublishTestResults@2
condition: succeededOrFailed()
inputs:
testRunner: JUnit
testResultsFiles: 'tmp/junit/*.xml'
- task: PublishBuildArtifacts@1
displayName: Upload Screenshots
condition: succeededOrFailed()
inputs:
PathtoPublish: 'tmp/reftests'
artifactName: ReftestResults

View File

@ -11,7 +11,6 @@ These are all of the available configuration options.
| Name | Default | Description |
| ------------- | :------: | ----------- |
| async | `true` | Whether to parse and render the element asynchronously
| allowTaint | `false` | Whether to allow cross-origin images to taint the canvas
| backgroundColor | `#ffffff` | Canvas background color, if none is specified in DOM. Set `null` for transparent
| canvas | `null` | Existing `canvas` element to use as a base for drawing on

View File

@ -13,8 +13,14 @@ methods to check whether an image would taint the canvas before applying it. If
If you wish to load images that reside outside of your pages origin, you can use a [proxy](/proxy) to load the images.
## Why is the produced canvas empty or cuts off half way through?
Make sure that `canvas` element doesn't hit [browser limitations](https://stackoverflow.com/questions/6081483/maximum-size-of-a-canvas-element) for the `canvas` size.
The limitations vary by browser, operating system and system hardware.
Make sure that `canvas` element doesn't hit [browser limitations](https://stackoverflow.com/questions/6081483/maximum-size-of-a-canvas-element) for the `canvas` size or use the window configuration options to set a custom window size based on the `canvas` element:
```
await html2canvas(element, {
windowWidth: element.scrollWidth,
windowHeight: element.scrollHeight
});
```
The window limitations vary by browser, operating system and system hardware.
### Chrome
> Maximum height/width: 32,767 pixels

View File

@ -1,82 +1,163 @@
// Karma configuration
// Generated on Sat Aug 05 2017 23:42:26 GMT+0800 (Malay Peninsula Standard Time)
const path = require('path');
const simctl = require('node-simctl');
const iosSimulator = require('appium-ios-simulator');
const port = 9876;
const log = require('karma/lib/logger').create('launcher:MobileSafari');
module.exports = function(config) {
const slLaunchers = (!process.env.SAUCE_USERNAME || !process.env.SAUCE_ACCESS_KEY) ? {} : {
sl_beta_chrome: {
base: 'SauceLabs',
browserName: 'chrome',
platform: 'Windows 10',
version: 'beta'
const launchers = {
Safari_IOS_9: {
base: 'MobileSafari',
name: 'iPhone 5s',
sdk: '9.0'
},
sl_ie9: {
Safari_IOS_10: {
base: 'MobileSafari',
name: 'iPhone 5s',
sdk: '10.0'
},
Safari_IOS_11: {
base: 'MobileSafari',
name: 'iPhone 5s',
sdk: '11.4'
},
SauceLabs_IE9: {
base: 'SauceLabs',
browserName: 'internet explorer',
version: '9.0',
platform: 'Windows 7'
},
sl_ie10: {
SauceLabs_IE10: {
base: 'SauceLabs',
browserName: 'internet explorer',
version: '10.0',
platform: 'Windows 7'
},
sl_ie11: {
SauceLabs_IE11: {
base: 'SauceLabs',
browserName: 'internet explorer',
version: '11.0',
platform: 'Windows 7'
},
sl_edge_15: {
SauceLabs_Edge18: {
base: 'SauceLabs',
browserName: 'MicrosoftEdge',
version: '15.15063',
version: '18.17763',
platform: 'Windows 10'
},
sl_edge_14: {
base: 'SauceLabs',
browserName: 'MicrosoftEdge',
version: '14.14393',
platform: 'Windows 10'
},
sl_safari: {
base: 'SauceLabs',
browserName: 'safari',
version: '10.1',
platform: 'macOS 10.12'
},
'sl_android_4.4': {
SauceLabs_Android4: {
base: 'SauceLabs',
browserName: 'Browser',
platform: 'Android',
version: '4.4',
device: 'Android Emulator',
},
'sl_ios_10.3_safari': {
SauceLabs_iOS10_3: {
base: 'SauceLabs',
browserName: 'Safari',
platform: 'iOS',
version: '10.3',
device: 'iPhone 7 Plus Simulator'
},
'sl_ios_9.3_safari': {
SauceLabs_iOS9_3: {
base: 'SauceLabs',
browserName: 'Safari',
platform: 'iOS',
version: '9.3',
device: 'iPhone 6 Plus Simulator'
},
IE_9: {
base: 'IE',
'x-ua-compatible': 'IE=EmulateIE9',
flags: ['-extoff']
},
IE_10: {
base: 'IE',
'x-ua-compatible': 'IE=EmulateIE10',
flags: ['-extoff']
},
IE_11: {
base: 'IE',
flags: ['-extoff']
},
Safari_Stable: {
base: 'Safari'
},
Chrome_Stable: {
base: 'Chrome'
},
Firefox_Stable: {
base: 'Firefox'
}
};
const customLaunchers = Object.assign({}, slLaunchers, {
const ciLauncher = launchers[process.env.TARGET_BROWSER];
const customLaunchers = ciLauncher ? {target_browser: ciLauncher} : {
stable_chrome: {
base: 'Chrome'
},
stable_firefox: {
base: 'Firefox'
}
});
};
const injectTypedArrayPolyfills = function(files) {
files.unshift({
pattern: path.resolve(__dirname, './node_modules/js-polyfills/typedarray.js'),
included: true,
served: true,
watched: false
});
};
injectTypedArrayPolyfills.$inject = ['config.files'];
const MobileSafari = function(baseBrowserDecorator, args) {
if(process.platform !== "darwin"){
log.error("This launcher only works in MacOS.");
this._process.kill();
return;
}
baseBrowserDecorator(this);
this.on('start', url => {
simctl.getDevices().then(devices => {
const d = devices[args.sdk].find(d => {
return d.name === args.name;
});
if (!d) {
log.error(`No device found for sdk ${args.sdk} with name ${args.name}`);
this._process.kill();
return;
}
return iosSimulator.getSimulator(d.udid).then(device => {
return simctl.bootDevice(d.udid).then(() => device);
}).then(device => {
return device.waitForBoot(60 * 5 * 1000).then(() => {
return device.openUrl(url);
});
});
}).catch(e => {
console.log('err,', e);
});
});
};
MobileSafari.prototype = {
name: 'MobileSafari',
DEFAULT_CMD: {
darwin: '/Applications/Xcode.app/Contents/Developer/Applications/Simulator.app/Contents/MacOS/Simulator',
},
ENV_CMD: null,
};
MobileSafari.$inject = ['baseBrowserDecorator', 'args'];
config.set({
@ -86,17 +167,26 @@ module.exports = function(config) {
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['mocha'],
frameworks: ['mocha', 'inline-mocha-fix'],
// list of files / patterns to load in the browser
files: [
'build/testrunner.js',
'build/RefTestRenderer.js',
{ pattern: './tests/**/*', 'watched': true, 'included': false, 'served': true},
{ pattern: './dist/**/*', 'watched': true, 'included': false, 'served': true},
{ pattern: './node_modules/**/*', 'watched': true, 'included': false, 'served': true}
{ pattern: './node_modules/**/*', 'watched': true, 'included': false, 'served': true},
],
plugins: [
'karma-*',
{
'framework:inline-mocha-fix': ['factory', injectTypedArrayPolyfills]
},
{
'launcher:MobileSafari': ['type', MobileSafari]
}
],
// list of files to exclude
exclude: [
@ -112,7 +202,11 @@ module.exports = function(config) {
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['progress', 'saucelabs'],
reporters: ['dots', 'junit'],
junitReporter: {
outputDir: 'tmp/junit/'
},
// web server port
port,

View File

@ -14,6 +14,12 @@ const bodyParser = require('body-parser');
const cors = require('cors');
const filenamifyUrl = require('filenamify-url');
const mkdirp = require('mkdirp');
const screenshotFolder = './tmp/reftests';
mkdirp.sync(path.resolve(__dirname, screenshotFolder));
const CORS_PORT = 8081;
const corsApp = express();
corsApp.use('/proxy', proxy());
@ -59,9 +65,9 @@ const writeScreenshot = (buffer, body) => {
const filename = `${filenamifyUrl(
body.test.replace(/^\/tests\/reftests\//, '').replace(/\.html$/, ''),
{replacement: '-'}
)}!${body.platform.name}-${body.platform.version}.png`;
)}!${[process.env.TARGET_BROWSER, body.platform.name, body.platform.version].join('-')}.png`;
fs.writeFileSync(path.resolve(__dirname, './tests/results/', filename), buffer);
fs.writeFileSync(path.resolve(__dirname, screenshotFolder, filename), buffer);
};
app.post('/screenshot', (req, res) => {

14178
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -3,7 +3,9 @@
"name": "html2canvas",
"description": "Screenshots with JavaScript",
"main": "dist/npm/index.js",
"version": "1.0.0-alpha.12",
"module": "dist/html2canvas.js",
"browser": "dist/html2canvas.js",
"version": "1.0.0-rc.1",
"author": {
"name": "Niklas von Hertzen",
"email": "niklasvh@gmail.com",
@ -20,51 +22,59 @@
"url": "https://github.com/niklasvh/html2canvas/issues"
},
"devDependencies": {
"babel-cli": "6.24.1",
"babel-core": "6.25.0",
"babel-eslint": "7.2.3",
"babel-loader": "7.1.1",
"babel-plugin-dev-expression": "0.2.1",
"babel-plugin-transform-es2015-modules-commonjs": "6.26.0",
"babel-plugin-transform-object-rest-spread": "6.23.0",
"babel-preset-es2015": "6.24.1",
"babel-preset-flow": "6.23.0",
"@babel/cli": "^7.4.3",
"@babel/core": "^7.4.3",
"@babel/preset-env": "^7.4.3",
"@babel/preset-flow": "^7.0.0",
"appium-ios-simulator": "^3.10.0",
"babel-eslint": "^10.0.1",
"babel-loader": "^8.0.5",
"babel-plugin-add-module-exports": "^1.0.0",
"babel-plugin-dev-expression": "^0.2.1",
"base64-arraybuffer": "0.1.5",
"body-parser": "1.17.2",
"body-parser": "^1.18.3",
"chai": "4.1.1",
"chromeless": "1.2.0",
"chromeless": "^1.5.2",
"cors": "2.8.4",
"eslint": "4.2.0",
"eslint": "^5.16.0",
"eslint-plugin-flowtype": "2.35.0",
"eslint-plugin-prettier": "2.1.2",
"express": "4.15.4",
"express": "^4.16.4",
"filenamify-url": "1.0.0",
"flow-bin": "0.56.0",
"glob": "7.1.2",
"html2canvas-proxy": "1.0.0",
"html2canvas-proxy": "1.0.1",
"jquery": "3.2.1",
"karma": "1.7.0",
"karma-chrome-launcher": "2.2.0",
"karma-edge-launcher": "0.4.1",
"karma-firefox-launcher": "1.0.1",
"karma-ie-launcher": "1.0.0",
"karma-mocha": "1.3.0",
"karma-sauce-launcher": "1.1.0",
"mocha": "3.5.0",
"js-polyfills": "^0.1.42",
"karma": "^4.0.1",
"karma-chrome-launcher": "^2.2.0",
"karma-edge-launcher": "^0.4.2",
"karma-firefox-launcher": "^1.1.0",
"karma-ie-launcher": "^1.0.0",
"karma-junit-reporter": "^1.2.0",
"karma-mocha": "^1.3.0",
"karma-safari-launcher": "^1.0.0",
"karma-sauce-launcher": "^2.0.2",
"mocha": "^6.1.0",
"node-simctl": "^5.0.0",
"platform": "1.3.4",
"prettier": "1.5.3",
"promise-polyfill": "6.0.2",
"replace-in-file": "^3.0.0",
"rimraf": "2.6.1",
"serve-index": "1.9.0",
"serve-index": "^1.9.1",
"slash": "1.0.0",
"standard-version": "^5.0.2",
"uglifyjs-webpack-plugin": "^1.1.2",
"webpack": "3.4.1"
"webpack": "^4.29.6",
"webpack-cli": "^3.3.0"
},
"scripts": {
"build": "rimraf dist/ && node scripts/create-reftest-list && npm run build:npm && npm run build:browser",
"build:npm": "babel src/ -d dist/npm/ --plugins=dev-expression,transform-es2015-modules-commonjs && replace-in-file __VERSION__ '\"$npm_package_version\"' dist/npm/index.js",
"build:npm": "babel src/ -d dist/npm/ --plugins=dev-expression && replace-in-file __VERSION__ '\"$npm_package_version\"' dist/npm/index.js",
"build:browser": "webpack",
"release": "standard-version",
"rollup": "rollup -c",
"format": "prettier --single-quote --no-bracket-spacing --tab-width 4 --print-width 100 --write \"{src,www/src,tests,scripts}/**/*.js\"",
"flow": "flow",
"lint": "eslint src/**",

37
rollup.config.js Normal file
View File

@ -0,0 +1,37 @@
'use strict';
const fs = require('fs');
const path = require('path');
const pkg = JSON.parse(fs.readFileSync(path.resolve(__dirname, 'package.json')));
const banner =
`/*
${pkg.title} ${pkg.version} <${pkg.homepage}>
Copyright (c) ${(new Date()).getFullYear()} ${pkg.author.name} <${pkg.author.url}>
Released under ${pkg.license} License
*/`;
import babel from 'rollup-plugin-babel';
import commonjs from 'rollup-plugin-commonjs';
import resolve from 'rollup-plugin-node-resolve';
export default {
input: './src/index.js',
plugins: [
resolve(),
babel({
exclude: 'node_modules/**'
}),
commonjs({
namedExports: {
'node_modules/css-line-break/dist/index.js': ['toCodePoints', 'fromCodePoint', 'LineBreaker']
}
})
],
output: {
file: './dist/html2canvas.js',
name: 'html2canvas',
format: 'umd',
banner
}
};

View File

@ -10,7 +10,7 @@ const outputPath = 'tests/reftests.js';
const ignoredTests = fs
.readFileSync(path.resolve(__dirname, `../tests/reftests/ignore.txt`))
.toString()
.split('\n')
.split(/\r\n|\r|\n/)
.filter(l => l.length)
.reduce((acc, l) => {
const m = l.match(/^(\[(.+)\])?(.+)$/i);

View File

@ -184,7 +184,6 @@ export class DocumentCloner {
return this.renderer(
documentElement,
{
async: this.options.async,
allowTaint: this.options.allowTaint,
backgroundColor: '#ffffff',
canvas: null,
@ -213,7 +212,12 @@ export class DocumentCloner {
new Promise((resolve, reject) => {
const iframeCanvas = document.createElement('img');
iframeCanvas.onload = () => resolve(canvas);
iframeCanvas.onerror = reject;
iframeCanvas.onerror = function(event) {
// Empty iframes may result in empty "data:," URLs, which are invalid from the <img>'s point of view
// and instead of `onload` cause `onerror` and unhandled rejection warnings
// https://github.com/niklasvh/html2canvas/issues/1502
iframeCanvas.src == 'data:,' ? resolve(canvas) : reject(event);
};
iframeCanvas.src = canvas.toDataURL();
if (tempIframe.parentNode) {
tempIframe.parentNode.replaceChild(
@ -229,21 +233,25 @@ export class DocumentCloner {
return tempIframe;
}
if (node instanceof HTMLStyleElement && node.sheet && node.sheet.cssRules) {
const css = [].slice.call(node.sheet.cssRules, 0).reduce((css, rule) => {
try {
try {
if (node instanceof HTMLStyleElement && node.sheet && node.sheet.cssRules) {
const css = [].slice.call(node.sheet.cssRules, 0).reduce((css, rule) => {
if (rule && rule.cssText) {
return css + rule.cssText;
}
return css;
} catch (err) {
this.logger.log('Unable to access cssText property', rule.name);
return css;
}
}, '');
const style = node.cloneNode(false);
style.textContent = css;
return style;
}, '');
const style = node.cloneNode(false);
style.textContent = css;
return style;
}
} catch (e) {
// accessing node.sheet.cssRules throws a DOMException
this.logger.log('Unable to access cssRules property');
if (e.name !== 'SecurityError') {
this.logger.log(e);
throw e;
}
}
return node.cloneNode(false);

View File

@ -27,38 +27,6 @@ const testRangeBounds = document => {
return false;
};
// iOS 10.3 taints canvas with base64 images unless crossOrigin = 'anonymous'
const testBase64 = (document: Document, src: string): Promise<boolean> => {
const img = new Image();
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
return new Promise(resolve => {
// Single pixel base64 image renders fine on iOS 10.3???
img.src = src;
const onload = () => {
try {
ctx.drawImage(img, 0, 0);
canvas.toDataURL();
} catch (e) {
return resolve(false);
}
return resolve(true);
};
img.onload = onload;
img.onerror = () => resolve(false);
if (img.complete === true) {
setTimeout(() => {
onload();
}, 500);
}
});
};
const testCORS = () => typeof new Image().crossOrigin !== 'undefined';
const testResponseType = () => typeof new XMLHttpRequest().responseType === 'string';
@ -135,15 +103,6 @@ const FEATURES = {
return value;
},
// $FlowFixMe - get/set properties not yet supported
get SUPPORT_BASE64_DRAWING() {
'use strict';
return (src: string) => {
const value = testBase64(document, src);
Object.defineProperty(FEATURES, 'SUPPORT_BASE64_DRAWING', {value: () => value});
return value;
};
},
// $FlowFixMe - get/set properties not yet supported
get SUPPORT_FOREIGNOBJECT_DRAWING() {
'use strict';
const value =

View File

@ -1,7 +1,7 @@
/* @flow */
'use strict';
import NodeContainer from './NodeContainer';
import type NodeContainer from './NodeContainer';
const LENGTH_WITH_UNIT = /([\d.]+)(px|r?em|%)/i;

View File

@ -488,7 +488,7 @@ const createCJKCounter = (
const CHINESE_INFORMAL_MULTIPLIERS = '十百千萬';
const CHINESE_FORMAL_MULTIPLIERS = '拾佰仟萬';
const JAPANESE_NEGATIVE = 'マイナス';
const KOREAN_NEGATIVE = '마이너스 ';
const KOREAN_NEGATIVE = '마이너스';
export const createCounterText = (
value: number,

View File

@ -129,42 +129,36 @@ export default class ResourceLoader {
this.logger.log(`Added image ${key.substring(0, 256)}`);
}
const imageLoadHandler = (supportsDataImages: boolean): Promise<Image> =>
new Promise((resolve, reject) => {
const img = new Image();
img.onload = () => resolve(img);
//ios safari 10.3 taints canvas with data urls unless crossOrigin is set to anonymous
if (!supportsDataImages || useCORS) {
img.crossOrigin = 'anonymous';
}
this.cache[key] = new Promise((resolve, reject) => {
const img = new Image();
img.onload = () => resolve(img);
//ios safari 10.3 taints canvas with data urls unless crossOrigin is set to anonymous
if (isInlineBase64Image(src) || useCORS) {
img.crossOrigin = 'anonymous';
}
img.onerror = reject;
img.src = src;
if (img.complete === true) {
// Inline XML images may fail to parse, throwing an Error later on
setTimeout(() => {
resolve(img);
}, 500);
}
if (this.options.imageTimeout) {
const timeout = this.options.imageTimeout;
setTimeout(
() =>
reject(
__DEV__
? `Timed out (${timeout}ms) fetching ${src.substring(0, 256)}`
: ''
),
timeout
);
}
});
img.onerror = reject;
img.src = src;
if (img.complete === true) {
// Inline XML images may fail to parse, throwing an Error later on
setTimeout(() => {
resolve(img);
}, 500);
}
if (this.options.imageTimeout) {
const timeout = this.options.imageTimeout;
setTimeout(
() =>
reject(
__DEV__
? `Timed out (${timeout}ms) fetching ${src.substring(0, 256)}`
: ''
),
timeout
);
}
});
this.cache[key] =
isInlineBase64Image(src) && !isSVG(src)
? // $FlowFixMe
FEATURES.SUPPORT_BASE64_DRAWING(src).then(imageLoadHandler)
: imageLoadHandler(true);
return key;
}

View File

@ -1,7 +1,7 @@
/* @flow */
'use strict';
import NodeContainer from './NodeContainer';
import type NodeContainer from './NodeContainer';
import {LineBreaker, fromCodePoint, toCodePoints} from 'css-line-break';
import {OVERFLOW_WRAP} from './parsing/overflowWrap';

View File

@ -8,7 +8,6 @@ import Logger from './Logger';
import {renderElement} from './Window';
export type Options = {
async: ?boolean,
allowTaint: ?boolean,
backgroundColor: string,
canvas: ?HTMLCanvasElement,
@ -50,7 +49,6 @@ const html2canvas = (element: HTMLElement, conf: ?Options): Promise<*> => {
const defaultView = ownerDocument.defaultView;
const defaultOptions = {
async: true,
allowTaint: false,
backgroundColor: '#ffffff',
imageTimeout: 15000,
@ -79,5 +77,4 @@ const html2canvas = (element: HTMLElement, conf: ?Options): Promise<*> => {
};
html2canvas.CanvasRenderer = CanvasRenderer;
module.exports = html2canvas;
export default html2canvas;

View File

@ -26,7 +26,10 @@ const addColorStops = (
const maxStop = Math.max.apply(null, gradient.colorStops.map(colorStop => colorStop.stop));
const f = 1 / Math.max(1, maxStop);
gradient.colorStops.forEach(colorStop => {
canvasGradient.addColorStop(f * colorStop.stop, colorStop.color.toString());
canvasGradient.addColorStop(
Math.floor(Math.max(0, f * colorStop.stop)),
colorStop.color.toString()
);
});
};
@ -232,6 +235,11 @@ export default class CanvasRenderer implements RenderTarget<HTMLCanvasElement> {
text.bounds.top + text.bounds.height
);
});
this.ctx.shadowColor = '';
this.ctx.shadowOffsetX = 0;
this.ctx.shadowOffsetY = 0;
this.ctx.shadowBlur = 0;
} else {
this.ctx.fillText(
text.text,

View File

@ -16,6 +16,7 @@ export default class ForeignObjectRenderer {
this.canvas.height = Math.floor(options.height) * options.scale;
this.canvas.style.width = `${options.width}px`;
this.canvas.style.height = `${options.height}px`;
this.ctx.scale(options.scale, options.scale);
options.logger.log(
`ForeignObject renderer initialized (${options.width}x${options.height} at ${options.x},${options.y}) with scale ${options.scale}`

View File

@ -24,7 +24,7 @@ import type {TextBounds} from '../TextBounds';
import {TEXT_DECORATION_STYLE, TEXT_DECORATION_LINE} from '../parsing/textDecoration';
import {PATH} from '../drawing/Path';
class RefTestRenderer implements RenderTarget<string> {
export default class RefTestRenderer implements RenderTarget<string> {
options: RenderOptions;
indent: number;
lines: Array<string>;
@ -268,5 +268,3 @@ class RefTestRenderer implements RenderTarget<string> {
this.lines.push(`${new Array(this.indent + 1).join(' ')}${text}`);
}
}
module.exports = RefTestRenderer;

View File

@ -123,7 +123,7 @@
<p><table><tr><td></table><p class="bad"> <!-- <table> closes <p> per the HTML4 DTD -->
<blockquote class="first one"><address class="second two"></address></blockquote>
<div class="forehead"><div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div></div>
<div class="eyes"><div id="eyes-a"><object data="data:application/x-unknown,ERROR"><object data="http://www.damowmow.com/404/" type="text/html"><object data="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAAAYCAYAAAFy7sgCAAAGsUlEQVRo3u2ZbWwcZxHHf3s%2B7LNbO3ZjXBtowprGODRX0qpNQCjmJKuVKhMl1P2AkCwhFOIKkCBSm9IXavGFKAixIAECwkmWo5MrhRI3Ub40IEwQgp6aIDg3Cd6eEqyIHEteah%2B1E69vhw%2BZtTaX8704ZzkKjHS6271nZ56ZZ%2BY%2F%2F%2BdZKF%2FCwYshx3EkkggLsD1v4FQkEZZYLCbAKyG9%2Ba9EIsG6hnUAf8x74K3aUC3j4%2BM54HcsR2oAIomwZOezkv%2FnSHpYNh%2BNCmAE7xv94zvFdd1bHsjMZmQkPSxAJP%2B%2FfuBLwK54PC7JZFKAVJmzXLBt2w%2FMvcDLwIb8QS8CeJ4nkURYIomw7J%2FYJ8BvSiiXptGGxWds2%2Fa9%2Bnaxh%2BYAD%2Bgt04NDgABTpQY2cvvSFLzw86gWeBVwC8SzlOSv2YeBPfmDBoBHgKmR9LBEEmHZfDTqGykqfkUE0nA78BzQGfSgUeP3wNeTXwXg7MwZDhw4UHL6ra2ti79%2FOvljgG8AZ4H64Lhm4MvAocxsRppGG%2FxcXihlwLIs6R%2FfKV2HO%2F26uA94pdDYUKUZUU7W1RQYXA98Gnhaf5%2FXWX0HeAHYoQonqa4sZSOsSWMCWeC9Yko%2BCQwBe4E6oNc0Tc91XTl1%2BaTsn9gnI%2Blhyc5nZWxsrBIkKSbl2tiic3tW53YDEwOKaoFBrcOfqKee53lG9xsPMjV784r%2F4lO%2FpPvyJ9iyZcuvFSaXK5XYeAZ4CDgGvB3MS4B54LQuWYPeuy4iRFsevsXqpuYoqVQKIH2bK1CuDQNo11o4XUzh%2FcDWYIe1LEtyuZx4niee54njOGKapgfsqlL%2Bl2OjEXg8nxrc1dJ0h3hbtL%2BGCtz7KPBF4CuBe9uB15VafE8hr9qylI3HgG8C2%2FK7VyHZoJj7MrBRm30qFotJMpkU27YlHo%2F7Ha5a%2BV%2FKRkSJ4KuKRLVLKapTjB1SzAVIjY2NSXY%2BKyPpYdk%2FsU9OXT4pruv6BdZbBQfKsVGnvWlIe1VB6VQO8JxC1vZYLCbZ%2BaxsPhpdZDyRRFhG0sPiOE6ldKBg2lRg4xF1YCDIIIKN7DGgD3gH%2BBXwejKZfPrs2tPs%2FvPN2bKuYR1nd7xLKBSSJeqoXKnERjPwNWAG%2BLn2rZuM%2B4Tpml6vaWlp4eLcxVusZq5lCgVgOVKJjRqdX86ffL4D5wIoZACnTpw4wRMdT96i%2FImOJxERAs4uVyqxUacF%2FPdiCj%2BjdRBRGFtwXVdG0sPSdbhTmkYbpH98p2RmM2JZlig1vl0GWo4NQ%2Fn%2Bs5pKRXfwjweaxy7TND3HcRZbfC6X8xVPVQlGy7WxVWlO5XRXFXm6EZmrQuSXYyPE3SiVoEhE6Wyr0u2rumO6zv%2B21AFdQAswC1wCMuUCXCmyWQus103Qg8qlDO0lxwOb%2Fl4FiK3AB3VS%2FuKKLtK%2FgbeAnwG%2FvUODuRw%2FFrR0H1UC75fwu8oJ%2FhFsW5VIG%2FBUgEIN6Y65O4AHu4Ap0zQ9y7LEcZyb9lRBUHQcRyzL8unZVBW5bFWAvAp%2BhDQ2g4F47dUYtlU6obXA54DnVdFLekjUGGifh4AFy7LEdV3xj3X9I66m0QZpGm2QrsOd0j%2B%2BU0bSw5KZzYjrun6HWlAd961i4FfCj0aN1Usau%2Bc1lmuXPFwvAEumUut7tQQvAb%2FXb%2FT0bCAej9cODg7yt%2Bm%2F8q2%2F7OUHZ76PnZ1k2p0mJzlykmPancbOTnL0whHs7CQfb%2B5mx2d3sH79%2BtCRI0c6FeaOr9ICrIQfLvA%2B8BGNXxi4R6HrisJVUWrxAVW2oMFf0Aczim8o3kV6enowDIPjF9%2Fk%2BMU3S3rrjzMMg56eHr%2BxP7qKFbASfojG6kpeDGs1tiW53RxwWT%2Bin5q8w4xpQK5evQpAR30H7ZH2khNvj7TTUd8BgD4rqmu1ZKX8qNeY%2BfHz4zlXDgT5E8tpCTUq7XSBC4Euv8227TV9fX1E73%2BYtvo27BmbS9cvFVTY3bSRFza9yOcf6Gfmygy7d%2B%2Fm%2FPnzF4DvrsBLhnJlJfwIKXxv1PheAE4qK6p4H9AGbNKTuhngBPBPXYRe4IemaT5kWZbR19fHNbmGnZ1k4r3U4glDR30Hm5qjbGjsImJEOHbsGHv27JFz5869o0eFq01Jq%2BmHAXwI6FFKagMTgHM7GzFDS%2BoeLSMv7zjzC9x4Y7gxFovVDAwMEI1GaWlpWSzRVCrFwYMH%2FXfxZ4AfAa8B%2F7lDaGg1%2FQgp43lfK0yqtRMuJa3ceKe5DfgYsCYAZ2ngD8CfAkzqTpW7xY%2F%2FSznyX%2FVeUb2kVmX4AAAAAElFTkSuQmCC">ERROR</object></object></object></div><div id="eyes-b"></div><div id="eyes-c"></div></div> <!-- that's a PNG with 8bit alpha containing two eyes -->
<div class="eyes"><div id="eyes-a"><object data="data:application/x-unknown,ERROR"><object data="http://localhost/404/" type="text/html"><object data="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAAAYCAYAAAFy7sgCAAAGsUlEQVRo3u2ZbWwcZxHHf3s%2B7LNbO3ZjXBtowprGODRX0qpNQCjmJKuVKhMl1P2AkCwhFOIKkCBSm9IXavGFKAixIAECwkmWo5MrhRI3Ub40IEwQgp6aIDg3Cd6eEqyIHEteah%2B1E69vhw%2BZtTaX8704ZzkKjHS6271nZ56ZZ%2BY%2F%2F%2BdZKF%2FCwYshx3EkkggLsD1v4FQkEZZYLCbAKyG9%2Ba9EIsG6hnUAf8x74K3aUC3j4%2BM54HcsR2oAIomwZOezkv%2FnSHpYNh%2BNCmAE7xv94zvFdd1bHsjMZmQkPSxAJP%2B%2FfuBLwK54PC7JZFKAVJmzXLBt2w%2FMvcDLwIb8QS8CeJ4nkURYIomw7J%2FYJ8BvSiiXptGGxWds2%2Fa9%2Bnaxh%2BYAD%2Bgt04NDgABTpQY2cvvSFLzw86gWeBVwC8SzlOSv2YeBPfmDBoBHgKmR9LBEEmHZfDTqGykqfkUE0nA78BzQGfSgUeP3wNeTXwXg7MwZDhw4UHL6ra2ti79%2FOvljgG8AZ4H64Lhm4MvAocxsRppGG%2FxcXihlwLIs6R%2FfKV2HO%2F26uA94pdDYUKUZUU7W1RQYXA98Gnhaf5%2FXWX0HeAHYoQonqa4sZSOsSWMCWeC9Yko%2BCQwBe4E6oNc0Tc91XTl1%2BaTsn9gnI%2Blhyc5nZWxsrBIkKSbl2tiic3tW53YDEwOKaoFBrcOfqKee53lG9xsPMjV784r%2F4lO%2FpPvyJ9iyZcuvFSaXK5XYeAZ4CDgGvB3MS4B54LQuWYPeuy4iRFsevsXqpuYoqVQKIH2bK1CuDQNo11o4XUzh%2FcDWYIe1LEtyuZx4niee54njOGKapgfsqlL%2Bl2OjEXg8nxrc1dJ0h3hbtL%2BGCtz7KPBF4CuBe9uB15VafE8hr9qylI3HgG8C2%2FK7VyHZoJj7MrBRm30qFotJMpkU27YlHo%2F7Ha5a%2BV%2FKRkSJ4KuKRLVLKapTjB1SzAVIjY2NSXY%2BKyPpYdk%2FsU9OXT4pruv6BdZbBQfKsVGnvWlIe1VB6VQO8JxC1vZYLCbZ%2BaxsPhpdZDyRRFhG0sPiOE6ldKBg2lRg4xF1YCDIIIKN7DGgD3gH%2BBXwejKZfPrs2tPs%2FvPN2bKuYR1nd7xLKBSSJeqoXKnERjPwNWAG%2BLn2rZuM%2B4Tpml6vaWlp4eLcxVusZq5lCgVgOVKJjRqdX86ffL4D5wIoZACnTpw4wRMdT96i%2FImOJxERAs4uVyqxUacF%2FPdiCj%2BjdRBRGFtwXVdG0sPSdbhTmkYbpH98p2RmM2JZlig1vl0GWo4NQ%2Fn%2Bs5pKRXfwjweaxy7TND3HcRZbfC6X8xVPVQlGy7WxVWlO5XRXFXm6EZmrQuSXYyPE3SiVoEhE6Wyr0u2rumO6zv%2B21AFdQAswC1wCMuUCXCmyWQus103Qg8qlDO0lxwOb%2Fl4FiK3AB3VS%2FuKKLtK%2FgbeAnwG%2FvUODuRw%2FFrR0H1UC75fwu8oJ%2FhFsW5VIG%2FBUgEIN6Y65O4AHu4Ap0zQ9y7LEcZyb9lRBUHQcRyzL8unZVBW5bFWAvAp%2BhDQ2g4F47dUYtlU6obXA54DnVdFLekjUGGifh4AFy7LEdV3xj3X9I66m0QZpGm2QrsOd0j%2B%2BU0bSw5KZzYjrun6HWlAd961i4FfCj0aN1Usau%2Bc1lmuXPFwvAEumUut7tQQvAb%2FXb%2FT0bCAej9cODg7yt%2Bm%2F8q2%2F7OUHZ76PnZ1k2p0mJzlykmPancbOTnL0whHs7CQfb%2B5mx2d3sH79%2BtCRI0c6FeaOr9ICrIQfLvA%2B8BGNXxi4R6HrisJVUWrxAVW2oMFf0Aczim8o3kV6enowDIPjF9%2Fk%2BMU3S3rrjzMMg56eHr%2BxP7qKFbASfojG6kpeDGs1tiW53RxwWT%2Bin5q8w4xpQK5evQpAR30H7ZH2khNvj7TTUd8BgD4rqmu1ZKX8qNeY%2BfHz4zlXDgT5E8tpCTUq7XSBC4Euv8227TV9fX1E73%2BYtvo27BmbS9cvFVTY3bSRFza9yOcf6Gfmygy7d%2B%2Fm%2FPnzF4DvrsBLhnJlJfwIKXxv1PheAE4qK6p4H9AGbNKTuhngBPBPXYRe4IemaT5kWZbR19fHNbmGnZ1k4r3U4glDR30Hm5qjbGjsImJEOHbsGHv27JFz5869o0eFq01Jq%2BmHAXwI6FFKagMTgHM7GzFDS%2BoeLSMv7zjzC9x4Y7gxFovVDAwMEI1GaWlpWSzRVCrFwYMH%2FXfxZ4AfAa8B%2F7lDaGg1%2FQgp43lfK0yqtRMuJa3ceKe5DfgYsCYAZ2ngD8CfAkzqTpW7xY%2F%2FSznyX%2FVeUb2kVmX4AAAAAElFTkSuQmCC">ERROR</object></object></object></div><div id="eyes-b"></div><div id="eyes-c"></div></div> <!-- that's a PNG with 8bit alpha containing two eyes -->
<div class="nose"><div><div></div></div></div>
<div class="empty"><div></div></div>
<div class="smile"><div><div><span><em><strong></strong></em></span></div></div></div>
@ -138,4 +138,4 @@
<div class="image-height-test"><table><tr><td><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAIAAAFSDNYfAAAAaklEQVR42u3XQQrAIAwAQeP%2F%2F6wf8CJBJTK9lnQ7FpHGaOurt1I34nfH9pMMZAZ8BwMGEvvh%2BBsJCAgICLwIOA8EBAQEBAQEBAQEBK79H5RfIQAAAAAAAAAAAAAAAAAAAAAAAAAAAID%2FABMSqAfj%2FsLmvAAAAABJRU5ErkJggg%3D%3D" alt=""></td></tr></table></div>
</div>
</body>
</html>
</html>

View File

@ -50,6 +50,18 @@
<span>testing with transparent</span>
<strong>testing with low opacity</strong>
</div>
<div id="capture" style="padding: 10px; background: #f5da55; border:2px solid blue;">
<h4 style="color: #000;text-shadow:0px 0px 5px green;">Hello world!</h4>
<div id="sampleDiv" style="border:2px solid red;padding:5px;margin:5px;">Sample Div with Border</div>
<div style="border:2px solid red;background-color:pink; padding:5px;margin:5px;">Sample Div with Border</div>
<div style="border:2px solid red;color:blue; padding:5px;margin:5px;">Sample Div with Border</div>
<div style="border:2px solid red;padding:5px;margin:5px;">Sample Div with Border</div>
<div style="border:2px solid red;padding:5px;text-shadow:0px 0px 5px red;margin:5px;">Sample Div with Border</div>
<div style="border:2px solid red;padding:5px;margin:5px;">Sample Div with Border</div>
<div style="border:2px solid red;padding:5px;margin:5px;">Sample Div with Border</div>
</div>
<p class="white-text-with-blue-shadow">Sed ut perspiciatis unde omnis iste
natus error sit voluptatem accusantium doloremque laudantium,
totam rem aperiam, eaque ipsa quae ab illo inventore.</p>

View File

@ -20,8 +20,7 @@ var REFTEST = window.location.search.indexOf('reftest') !== -1;
(typeof Promise === 'undefined' ? ['/node_modules/promise-polyfill/promise.min'] : [])
.concat([
'/node_modules/jquery/dist/jquery.min',
'/dist/html2canvas',
'/dist/RefTestRenderer'
'/dist/html2canvas'
])
.forEach(appendScript);

View File

@ -75,7 +75,7 @@ const assertPath = (result, expected, desc) => {
.filter(test => {
return (
!Array.isArray(reftests.ignoredTests[test]) ||
reftests.ignoredTests[test].indexOf(query.browser) === -1
reftests.ignoredTests[test].indexOf(platform.name) === -1
);
})
.forEach(url => {
@ -342,79 +342,37 @@ const assertPath = (result, expected, desc) => {
}
if (window.__karma__) {
const MAX_CHUNK_SIZE = 75000;
return new Promise((resolve, reject) => {
const xhr =
'withCredentials' in new XMLHttpRequest()
? new XMLHttpRequest()
: new XDomainRequest();
const sendScreenshot = (tries, body, server) => {
return new Promise((resolve, reject) => {
const xhr =
'withCredentials' in new XMLHttpRequest()
? new XMLHttpRequest()
: new XDomainRequest();
xhr.onload = () => {
if (
typeof xhr.status !== 'number' ||
xhr.status === 200
) {
resolve();
} else {
reject(
`Failed to send screenshot with status ${xhr.status}`
);
}
};
xhr.onerror = reject;
xhr.open('POST', server, true);
xhr.send(body);
}).catch(e => {
if (tries > 0) {
// Older edge browsers and some safari browsers have issues sending large xhr through saucetunnel
const data = canvas.toDataURL();
const totalCount = Math.ceil(
data.length / MAX_CHUNK_SIZE
);
return Promise.all(
Array.apply(
null,
Array(totalCount)
).map((x, part) =>
sendScreenshot(
0,
JSON.stringify({
screenshot: data.substr(
part * MAX_CHUNK_SIZE,
MAX_CHUNK_SIZE
),
part,
totalCount,
test: url,
platform: {
name: platform.name,
version: platform.version
}
}),
'http://localhost:8000/screenshot/chunk'
)
)
xhr.onload = () => {
if (
typeof xhr.status !== 'number' ||
xhr.status === 200
) {
resolve();
} else {
reject(
`Failed to send screenshot with status ${xhr.status}`
);
}
};
xhr.onerror = reject;
return Promise.reject(e);
});
};
return sendScreenshot(
1,
JSON.stringify({
xhr.open('POST', 'http://localhost:8000/screenshot', true);
xhr.send(JSON.stringify({
screenshot: canvas.toDataURL(),
test: url,
platform: {
name: platform.name,
version: platform.version
}
}),
'http://localhost:8000/screenshot'
);
}));
});
}
});
});

View File

@ -18,7 +18,7 @@ const plugins = [
];
const modules = {
loaders: [{
rules: [{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader'
@ -27,20 +27,26 @@ const modules = {
module.exports = [
{
mode: 'development',
entry: './src/index.js',
output: {
filename: './dist/html2canvas.js',
path: path.resolve(__dirname, 'dist'),
filename: 'html2canvas.js',
library: 'html2canvas',
libraryExport: 'default',
libraryTarget: 'umd'
},
module: modules,
plugins
},
{
mode: 'production',
entry: './src/index.js',
output: {
filename: './dist/html2canvas.min.js',
path: path.resolve(__dirname, 'dist'),
filename: 'html2canvas.min.js',
library: 'html2canvas',
libraryExport: 'default',
libraryTarget: 'umd'
},
module: modules,
@ -54,19 +60,24 @@ module.exports = [
]
},
{
mode: 'production',
entry: './src/renderer/RefTestRenderer.js',
output: {
filename: './dist/RefTestRenderer.js',
path: path.resolve(__dirname, 'build'),
filename: 'RefTestRenderer.js',
library: 'RefTestRenderer',
libraryExport: 'default',
libraryTarget: 'umd'
},
module: modules,
plugins
},
{
mode: 'production',
entry: './tests/testrunner.js',
output: {
filename: './build/testrunner.js',
path: path.resolve(__dirname, 'build'),
filename: 'testrunner.js',
library: 'testrunner',
libraryTarget: 'umd'
},

17351
www/package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -5,23 +5,29 @@
"private": true,
"author": "Niklas von Hertzen",
"dependencies": {
"cpy-cli": "^1.0.1",
"gatsby": "^1.9.127",
"gatsby-link": "^1.6.30",
"gatsby-plugin-catch-links": "^1.0.13",
"gatsby-plugin-glamor": "^1.6.9",
"gatsby-plugin-google-analytics": "^1.0.14",
"gatsby-plugin-react-helmet": "^1.0.8",
"gatsby-plugin-twitter": "^1.0.14",
"gatsby-plugin-typography": "^1.7.10",
"gatsby-remark-prismjs": "^1.2.10",
"gatsby-source-filesystem": "^1.5.9",
"gatsby-transformer-remark": "^1.7.23",
"gzip-size": "^4.1.0",
"html2canvas": "^1.0.0-alpha.9",
"cpy-cli": "^2.0.0",
"gatsby": "^2.3.14",
"gatsby-link": "^2.0.16",
"gatsby-plugin-catch-links": "^2.0.13",
"gatsby-plugin-glamor": "^2.0.9",
"gatsby-plugin-google-analytics": "^2.0.18",
"gatsby-plugin-react-helmet": "^3.0.12",
"gatsby-plugin-twitter": "^2.0.13",
"gatsby-plugin-typography": "^2.2.10",
"gatsby-remark-prismjs": "^3.2.7",
"gatsby-source-filesystem": "^2.0.28",
"gatsby-transformer-remark": "^2.3.8",
"glamor": "^2.20.40",
"gzip-size": "^5.0.0",
"html2canvas": "^1.0.0-alpha.12",
"mkdirp": "^0.5.1",
"typography": "^0.16.6",
"typography-theme-github": "^0.15.10"
"prismjs": "^1.16.0",
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-helmet": "^5.2.0",
"react-typography": "^0.16.19",
"typography": "^0.16.19",
"typography-theme-github": "^0.16.19"
},
"license": "MIT",
"main": "n/a",

View File

@ -37,6 +37,7 @@ class CanvasContainer extends Component {
>
<img
src={close}
alt="Close"
css={{position: 'absolute', right: '20px', top: '20px', cursor: 'pointer'}}
/>
</div>
@ -123,6 +124,7 @@ export default class Example extends Component {
flex: 1,
margin: 0
}}
alt="Try html2canvas"
/>
</div>
</div>

View File

@ -1,19 +1,14 @@
import React from 'react';
import PropTypes from 'prop-types';
import Helmet from 'react-helmet';
require('prismjs/themes/prism-solarizedlight.css');
import './index.css';
import './layout.css';
import Example from '../components/example';
require('prismjs/themes/prism-solarizedlight.css');
const TemplateWrapper = ({children}) =>
<div>
<Helmet title="html2canvas - Screenshots with JavaScript" />
{children()}
{children}
<Example />
</div>;
TemplateWrapper.propTypes = {
children: PropTypes.func
};
export default TemplateWrapper;

View File

@ -61,6 +61,7 @@ export default class Navigation extends Component {
<img
src={menu}
onClick={() => this.setState(s => ({open: !s.open}))}
alt="Menu"
css={{
width: '50px',
cursor: 'pointer',
@ -72,7 +73,7 @@ export default class Navigation extends Component {
}}
/>
<Link to="/">
<img src={logo} css={{margin: 0}} />
<img src={logo} css={{margin: 0}} alt="html2canvas" />
</Link>
</div>

View File

@ -1,9 +1,10 @@
import React from 'react';
import Layout from '../components/layout';
const NotFoundPage = () =>
<div>
<Layout>
<h1>NOT FOUND</h1>
<p>You just hit a route that doesn&#39;t exist... the sadness.</p>
</div>;
</Layout>;
export default NotFoundPage;

View File

@ -1,6 +1,7 @@
import React from 'react';
import Link from 'gatsby-link';
import logo from '../images/logo_icon.svg';
import Layout from '../components/layout';
import Footer from '../components/footer';
import Carbon from '../components/carbon';
@ -23,6 +24,7 @@ const linkStyle = {
export default ({data}) => {
return (
<Layout>
<div
css={{
background: '#558b2f',
@ -48,7 +50,7 @@ export default ({data}) => {
}}
>
<div css={{display: 'flex', alignItems: 'center', justifyContent: 'center'}}>
<img src={logo} />
<img src={logo} alt="html2canvas" />
<h1>html2canvas</h1>
</div>
<h4 css={{color: 'rgba(255, 255, 255, 0.6)', fontWeight: 300}}>
@ -111,7 +113,7 @@ export default ({data}) => {
<div css={{margin: '20px'}}>
<a
href="#"
href="/documentation"
css={linkStyle}
onClick={e => {
e.preventDefault();
@ -194,6 +196,7 @@ export default ({data}) => {
<h5>Connect</h5>
<div css={{height: '35px'}}>
<iframe
title="Github"
src="https://ghbtns.com/github-btn.html?user=niklasvh&repo=html2canvas&type=star&count=true&size=large"
frameBorder="0"
scrolling="0"
@ -217,6 +220,7 @@ export default ({data}) => {
</div>
<Footer />
</div>
</Layout>
);
};

View File

@ -4,6 +4,7 @@ import back from '../images/ic_arrow_back_black_24px.svg';
import next from '../images/ic_arrow_forward_black_24px.svg';
import Carbon from '../components/carbon';
import Footer from '../components/footer';
import Layout from '../components/layout';
import Helmet from 'react-helmet';
import Navigation from '../components/navigation';
@ -11,7 +12,7 @@ export default ({data}) => {
const post = data.markdownRemark;
return (
<div>
<Layout>
<Helmet
title={`${post.frontmatter.title} - html2canvas`}
meta={[{name: 'description', content: post.frontmatter.description}]}
@ -103,7 +104,7 @@ export default ({data}) => {
}}
>
<div css={{height: '24px'}}>
<img src={back} />
<img src={back} alt="" />
</div>
<div>
<span
@ -162,7 +163,7 @@ export default ({data}) => {
</div>
<div css={{height: '24px'}}>
<img src={next} />
<img src={next} alt="" />
</div>
</Link>
: null}
@ -171,7 +172,7 @@ export default ({data}) => {
: null}
<Footer css={{marginLeft: '300px'}} />
</div>
</div>
</Layout>
);
};

View File

@ -1,5 +1,4 @@
import Typography from 'typography';
import githubTheme from 'typography-theme-github';
const theme = {
googleFonts: [

1
www/static/CNAME Normal file
View File

@ -0,0 +1 @@
html2canvas.hertzen.com