diff --git a/superset-frontend/package-lock.json b/superset-frontend/package-lock.json index c0b831b35d..b4969863ac 100644 --- a/superset-frontend/package-lock.json +++ b/superset-frontend/package-lock.json @@ -66,7 +66,7 @@ "d3-array": "^1.2.4", "d3-color": "^1.2.0", "d3-scale": "^2.1.2", - "dom-to-image": "^2.6.0", + "dom-to-image-more": "^2.10.1", "emotion-rgba": "0.0.9", "fast-glob": "^3.2.7", "fontsource-fira-code": "^4.0.0", @@ -177,7 +177,6 @@ "@testing-library/react-hooks": "^5.0.3", "@testing-library/user-event": "^12.7.0", "@types/classnames": "^2.2.10", - "@types/dom-to-image": "^2.6.0", "@types/enzyme": "^3.10.5", "@types/enzyme-adapter-react-16": "^1.0.6", "@types/fetch-mock": "^7.3.2", @@ -16736,15 +16735,6 @@ "resolved": "https://registry.npmjs.org/@types/d3-time-format/-/d3-time-format-2.3.1.tgz", "integrity": "sha512-fck0Z9RGfIQn3GJIEKVrp15h9m6Vlg0d5XXeiE/6+CQiBmMDZxfR21XtjEPuDeg7gC3bBM0SdieA5XF3GW1wKA==" }, - "node_modules/@types/dom-to-image": { - "version": "2.6.0", - "resolved": "https://registry.npmjs.org/@types/dom-to-image/-/dom-to-image-2.6.0.tgz", - "integrity": "sha512-X7qEh5AI1s/fb/Ijb1WU/tl7nZjD/A3b0PZiq3QjD31EZkgPooPdpte9MCJWQgqjxA0F8AJFuPd53YDrFJFE7w==", - "dev": true, - "dependencies": { - "@types/node": "*" - } - }, "node_modules/@types/enzyme": { "version": "3.10.10", "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-3.10.10.tgz", @@ -26331,10 +26321,10 @@ "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz", "integrity": "sha1-vSh3PiZCiBrsUVRJJCmcXNgiGFs=" }, - "node_modules/dom-to-image": { - "version": "2.6.0", - "resolved": "https://registry.npmjs.org/dom-to-image/-/dom-to-image-2.6.0.tgz", - "integrity": "sha1-ilA2CAiMh7HCL5A0rgMuGJiVWGc=" + "node_modules/dom-to-image-more": { + "version": "2.10.1", + "resolved": "https://registry.npmjs.org/dom-to-image-more/-/dom-to-image-more-2.10.1.tgz", + "integrity": "sha512-gMG28V47WGj5/xvrsbSPJAWSaV7CBh4teLErn1iGD1sa29HsFsHxvnoLj8VxVvfqnjPgsiUGs2IV2VAxLJGb+A==" }, "node_modules/dom-walk": { "version": "0.1.1", @@ -68804,15 +68794,6 @@ "resolved": "https://registry.npmjs.org/@types/d3-time-format/-/d3-time-format-2.3.1.tgz", "integrity": "sha512-fck0Z9RGfIQn3GJIEKVrp15h9m6Vlg0d5XXeiE/6+CQiBmMDZxfR21XtjEPuDeg7gC3bBM0SdieA5XF3GW1wKA==" }, - "@types/dom-to-image": { - "version": "2.6.0", - "resolved": "https://registry.npmjs.org/@types/dom-to-image/-/dom-to-image-2.6.0.tgz", - "integrity": "sha512-X7qEh5AI1s/fb/Ijb1WU/tl7nZjD/A3b0PZiq3QjD31EZkgPooPdpte9MCJWQgqjxA0F8AJFuPd53YDrFJFE7w==", - "dev": true, - "requires": { - "@types/node": "*" - } - }, "@types/enzyme": { "version": "3.10.10", "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-3.10.10.tgz", @@ -76396,10 +76377,10 @@ } } }, - "dom-to-image": { - "version": "2.6.0", - "resolved": "https://registry.npmjs.org/dom-to-image/-/dom-to-image-2.6.0.tgz", - "integrity": "sha1-ilA2CAiMh7HCL5A0rgMuGJiVWGc=" + "dom-to-image-more": { + "version": "2.10.1", + "resolved": "https://registry.npmjs.org/dom-to-image-more/-/dom-to-image-more-2.10.1.tgz", + "integrity": "sha512-gMG28V47WGj5/xvrsbSPJAWSaV7CBh4teLErn1iGD1sa29HsFsHxvnoLj8VxVvfqnjPgsiUGs2IV2VAxLJGb+A==" }, "dom-walk": { "version": "0.1.1", diff --git a/superset-frontend/package.json b/superset-frontend/package.json index 7cccb005be..ff5254178c 100644 --- a/superset-frontend/package.json +++ b/superset-frontend/package.json @@ -126,7 +126,7 @@ "d3-array": "^1.2.4", "d3-color": "^1.2.0", "d3-scale": "^2.1.2", - "dom-to-image": "^2.6.0", + "dom-to-image-more": "^2.10.1", "emotion-rgba": "0.0.9", "fast-glob": "^3.2.7", "fontsource-fira-code": "^4.0.0", @@ -237,7 +237,6 @@ "@testing-library/react-hooks": "^5.0.3", "@testing-library/user-event": "^12.7.0", "@types/classnames": "^2.2.10", - "@types/dom-to-image": "^2.6.0", "@types/enzyme": "^3.10.5", "@types/enzyme-adapter-react-16": "^1.0.6", "@types/fetch-mock": "^7.3.2", diff --git a/superset-frontend/src/dashboard/components/Header/HeaderActionsDropdown/index.jsx b/superset-frontend/src/dashboard/components/Header/HeaderActionsDropdown/index.jsx index a7860af30f..3d25b049fb 100644 --- a/superset-frontend/src/dashboard/components/Header/HeaderActionsDropdown/index.jsx +++ b/superset-frontend/src/dashboard/components/Header/HeaderActionsDropdown/index.jsx @@ -174,7 +174,6 @@ class HeaderActionsDropdown extends React.PureComponent { downloadAsImage( SCREENSHOT_NODE_SELECTOR, this.props.dashboardTitle, - {}, true, )(domEvent).then(() => { menu.style.visibility = 'visible'; diff --git a/superset-frontend/src/explore/components/useExploreAdditionalActionsMenu/index.jsx b/superset-frontend/src/explore/components/useExploreAdditionalActionsMenu/index.jsx index 3ca85643cb..0740bd16c9 100644 --- a/superset-frontend/src/explore/components/useExploreAdditionalActionsMenu/index.jsx +++ b/superset-frontend/src/explore/components/useExploreAdditionalActionsMenu/index.jsx @@ -195,7 +195,6 @@ export const useExploreAdditionalActionsMenu = ( '.panel-body .chart-container', // eslint-disable-next-line camelcase slice?.slice_name ?? t('New chart'), - {}, true, )(domEvent); setIsDropdownVisible(false); diff --git a/superset-frontend/src/types/dom-to-image-more.d.ts b/superset-frontend/src/types/dom-to-image-more.d.ts new file mode 100644 index 0000000000..c5a93de757 --- /dev/null +++ b/superset-frontend/src/types/dom-to-image-more.d.ts @@ -0,0 +1,37 @@ +/** + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance + * with the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + */ + +declare module 'dom-to-image-more' { + export interface Options { + filter?: ((node: Node) => boolean) | undefined; + bgcolor?: string | undefined; + width?: number | undefined; + height?: number | undefined; + style?: {} | undefined; + quality?: number | undefined; + imagePlaceholder?: string | undefined; + cacheBust?: boolean | undefined; + } + + class DomToImageMore { + static toJpeg(node: Node, options?: Options): Promise; + } + + export default DomToImageMore; +} diff --git a/superset-frontend/src/utils/downloadAsImage.ts b/superset-frontend/src/utils/downloadAsImage.ts index 8c074bcdf2..145fb86508 100644 --- a/superset-frontend/src/utils/downloadAsImage.ts +++ b/superset-frontend/src/utils/downloadAsImage.ts @@ -17,7 +17,7 @@ * under the License. */ import { SyntheticEvent } from 'react'; -import domToImage from 'dom-to-image'; +import domToImage from 'dom-to-image-more'; import kebabCase from 'lodash/kebabCase'; import { t } from '@superset-ui/core'; import { addWarningToast } from 'src/components/MessageToasts/actions'; @@ -43,7 +43,6 @@ const generateFileStem = (description: string, date = new Date()) => * @param selector css selector of the parent element which should be turned into image * @param description name or a short description of what is being printed. * Value will be normalized, and a date as well as a file extension will be added. - * @param domToImageOptions dom-to-image Options object. * @param isExactSelector if false, searches for the closest ancestor that matches selector. * @returns event handler */