Skip to content

Commit 4877b4f

Browse files
c298leec298lee
committed
working feedback screenshot package with preact
1 parent 7a22a83 commit 4877b4f

21 files changed

+392
-1
lines changed

‎.craft.yml

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,10 @@ targets:
3636
- name: npm
3737
id: '@sentry-internal/replay-canvas'
3838
includeNames: /^sentry-internal-replay-canvas-\d.*\.tgz$/
39+
## 1.9 FeedbackScreenshot package (browser only)
40+
- name: npm
41+
id: '@sentry-internal/feedback-screenshot'
42+
includeNames: /^sentry-internal-feedback-screenshot-\d.*\.tgz$/
3943

4044
## 2. Browser & Node SDKs
4145
- name: npm

‎.github/workflows/build.yml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -108,6 +108,7 @@ jobs:
108108
- 'packages/replay/**'
109109
- 'packages/replay-canvas/**'
110110
- 'packages/feedback/**'
111+
- 'packages/feedback-screenshot/**'
111112
- 'packages/wasm/**'
112113
browser_integration:
113114
- *shared

‎package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -56,6 +56,7 @@
5656
"packages/eslint-config-sdk",
5757
"packages/eslint-plugin-sdk",
5858
"packages/feedback",
59+
"packages/feedback-screenshot",
5960
"packages/gatsby",
6061
"packages/integrations",
6162
"packages/integration-shims",

‎packages/browser/src/index.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -90,3 +90,5 @@ export {
9090
BrowserProfilingIntegration,
9191
browserProfilingIntegration,
9292
} from './profiling/integration';
93+
94+
console.log('browser');

‎packages/feedback-screenshot/.eslintignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
node_modules/
2+
build/

‎packages/feedback-screenshot/.eslintrc.js

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
// Note: All paths are relative to the directory in which eslint is being run, rather than the directory where this file
2+
// lives
3+
4+
// ESLint config docs: https://eslint.org/docs/user-guide/configuring/
5+
6+
module.exports = {
7+
extends: ['../../.eslintrc.js'],
8+
overrides: [
9+
{
10+
files: ['src/**/*.ts'],
11+
rules: {
12+
'@sentry-internal/sdk/no-unsupported-es6-methods': 'off',
13+
},
14+
},
15+
{
16+
files: ['jest.setup.ts', 'jest.config.ts'],
17+
parserOptions: {
18+
project: ['tsconfig.test.json'],
19+
},
20+
rules: {
21+
'no-console': 'off',
22+
},
23+
},
24+
],
25+
};

‎packages/feedback-screenshot/.gitignore

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
node_modules
2+
/*.tgz
3+
.eslintcache
4+
build

‎packages/feedback-screenshot/LICENSE

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
Copyright (c) 2024 Sentry (https://sentry.io) and individual contributors. All rights reserved.
2+
3+
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
4+
documentation files (the "Software"), to deal in the Software without restriction, including without limitation the
5+
rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit
6+
persons to whom the Software is furnished to do so, subject to the following conditions:
7+
8+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the
9+
Software.
10+
11+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE
12+
WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
13+
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR
14+
OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

‎packages/feedback-screenshot/README.md

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<p align="center">
2+
<a href="https://sentry.io/?utm_source=github&utm_medium=logo" target="_blank">
3+
<img src="https://sentry-brand.storage.googleapis.com/sentry-wordmark-dark-280x84.png" alt="Sentry" width="280" height="84">
4+
</a>
5+
</p>
6+
7+
# Sentry Integration for Feedback with Screenshot
8+
9+
This SDK is **considered experimental and in a beta state**. It may experience breaking changes, and may be discontinued
10+
at any time. Please reach out on [GitHub](https://github.com/getsentry/sentry-javascript/issues/new/choose) if you have
11+
any feedback/concerns.
12+
13+
To view Feedback in Sentry, your
14+
[Sentry organization must be an early adopter](https://docs.sentry.io/product/accounts/early-adopter-features/).
15+
16+
## Installation
17+
18+
Please read the [offical integration documentation](https://docs.sentry.io/platforms/javascript/user-feedback/) for
19+
installation instructions.
20+
21+
## Configuration
22+
23+
The Feedback integration is highly customizable, please read the
24+
[official integration documentation](https://docs.sentry.io/platforms/javascript/user-feedback/configuration/) for the
25+
most up-to-date configuration options.

‎packages/feedback-screenshot/jest.config.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
const baseConfig = require('../../jest/jest.config.js');
2+
3+
module.exports = {
4+
...baseConfig,
5+
testEnvironment: 'jsdom',
6+
};

‎packages/feedback-screenshot/package.json

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
{
2+
"name": "@sentry-internal/feedback-screenshot",
3+
"version": "7.100.0",
4+
"description": "Sentry SDK integration for user feedback screenshots",
5+
"repository": "git://github.com/getsentry/sentry-javascript.git",
6+
"homepage": "https://github.com/getsentry/sentry-javascript/tree/master/packages/feedback",
7+
"author": "Sentry",
8+
"license": "MIT",
9+
"engines": {
10+
"node": ">=12"
11+
},
12+
"files": [
13+
"cjs",
14+
"esm",
15+
"types",
16+
"types-ts3.8"
17+
],
18+
"main": "build/npm/cjs/index.js",
19+
"module": "build/npm/esm/index.js",
20+
"types": "build/npm/types/index.d.ts",
21+
"typesVersions": {
22+
"<4.9": {
23+
"build/npm/types/index.d.ts": [
24+
"build/npm/types-ts3.8/index.d.ts"
25+
]
26+
}
27+
},
28+
"publishConfig": {
29+
"access": "public"
30+
},
31+
"dependencies": {
32+
"@sentry/core": "7.100.0",
33+
"@sentry/types": "7.100.0",
34+
"@sentry/utils": "7.100.0",
35+
"preact": "^10.19.4",
36+
"preact-compat": "^3.19.0",
37+
"@rollup/plugin-alias": "5.1.0"
38+
},
39+
"scripts": {
40+
"build": "run-p build:transpile build:types build:bundle",
41+
"build:transpile": "rollup -c rollup.npm.config.mjs",
42+
"build:bundle": "rollup -c rollup.bundle.config.mjs",
43+
"build:dev": "run-p build:transpile build:types",
44+
"build:types": "run-s build:types:core build:types:downlevel",
45+
"build:types:core": "tsc -p tsconfig.types.json",
46+
"build:types:downlevel": "yarn downlevel-dts build/npm/types build/npm/types-ts3.8 --to ts3.8",
47+
"build:watch": "run-p build:transpile:watch build:bundle:watch build:types:watch",
48+
"build:dev:watch": "run-p build:transpile:watch build:types:watch",
49+
"build:transpile:watch": "yarn build:transpile --watch",
50+
"build:bundle:watch": "yarn build:bundle --watch",
51+
"build:types:watch": "tsc -p tsconfig.types.json --watch",
52+
"build:tarball": "ts-node ../../scripts/prepack.ts --bundles && npm pack ./build/npm",
53+
"circularDepCheck": "madge --circular src/index.ts",
54+
"clean": "rimraf build sentry-feedback-*.tgz",
55+
"fix": "eslint . --format stylish --fix",
56+
"lint": "eslint . --format stylish",
57+
"test": "jest",
58+
"test:watch": "jest --watch",
59+
"yalc:publish": "ts-node ../../scripts/prepack.ts --bundles && yalc publish ./build/npm --push --sig"
60+
},
61+
"volta": {
62+
"extends": "../../package.json"
63+
},
64+
"sideEffects": false
65+
}

‎packages/feedback-screenshot/rollup.bundle.config.mjs

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import { makeBaseBundleConfig, makeBundleConfigVariants } from '@sentry-internal/rollup-utils';
2+
import alias from '@rollup/plugin-alias';
3+
4+
const baseBundleConfig = makeBaseBundleConfig({
5+
bundleType: 'addon',
6+
entrypoints: ['src/index.ts'],
7+
jsVersion: 'es6',
8+
licenseTitle: '@sentry-internal/feedback-screenshot',
9+
outputFileBase: () => 'bundles/feedback-screenshot',
10+
plugins: [
11+
alias({
12+
entries: [
13+
{ find: 'react', replacement: 'preact/compat' },
14+
{ find: 'react-dom/test-utils', replacement: 'preact/test-utils' },
15+
{ find: 'react-dom', replacement: 'preact/compat' },
16+
{ find: 'react/jsx-runtime', replacement: 'preact/jsx-runtime' }
17+
]
18+
})
19+
],
20+
21+
});
22+
23+
const builds = makeBundleConfigVariants(baseBundleConfig);
24+
25+
export default builds;

‎packages/feedback-screenshot/rollup.npm.config.mjs

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
import { makeBaseNPMConfig, makeNPMConfigVariants } from '@sentry-internal/rollup-utils';
2+
import alias from '@rollup/plugin-alias';
3+
4+
export default makeNPMConfigVariants(
5+
makeBaseNPMConfig({
6+
hasBundles: true,
7+
packageSpecificConfig: {
8+
output: {
9+
// set exports to 'named' or 'auto' so that rollup doesn't warn
10+
exports: 'named',
11+
// set preserveModules to false because for Replay we actually want
12+
// to bundle everything into one file.
13+
preserveModules: false,
14+
},
15+
},
16+
plugins: ['@babel/transform-react-jsx', { pragma: 'h' },
17+
alias({
18+
entries: [
19+
{ find: 'react', replacement: 'preact/compat' },
20+
{ find: 'react-dom/test-utils', replacement: 'preact/test-utils' },
21+
{ find: 'react-dom', replacement: 'preact/compat' },
22+
{ find: 'react/jsx-runtime', replacement: 'preact/jsx-runtime' }
23+
]
24+
})
25+
],
26+
}),
27+
);

‎packages/feedback-screenshot/scripts/craft-pre-release.sh

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
#!/bin/bash
2+
set -eux
3+
OLD_VERSION="${1}"
4+
NEW_VERSION="${2}"
5+
6+
# Do not tag and commit changes made by "npm version"
7+
export npm_config_git_tag_version=false
8+
npm version "${NEW_VERSION}"

‎packages/feedback-screenshot/src/index.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
export {
2+
// eslint-disable-next-line deprecation/deprecation
3+
FeedbackScreenshot,
4+
feedbackScreenshotIntegration,
5+
} from './screenshot';
6+
export type { FeedbackScreenshotIntegrationOptions } from './screenshot';
7+
8+
console.log('screenshot 6');

‎packages/feedback-screenshot/src/screenshot.ts

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
import { convertIntegrationFnToClass, defineIntegration } from '@sentry/core';
2+
import type { Integration, IntegrationClass, IntegrationFn } from '@sentry/types';
3+
import { Hello } from './screenshotWidget';
4+
import { GLOBAL_OBJ } from '@sentry/utils';
5+
import { h, render } from 'preact';
6+
7+
interface FeedbackScreenshotOptions {
8+
el: Element;
9+
props: string;
10+
}
11+
12+
export interface FeedbackScreenshotIntegrationOptions {
13+
el: Element;
14+
props: string;
15+
}
16+
17+
const INTEGRATION_NAME = 'FeedbackScreenshot';
18+
const WINDOW = GLOBAL_OBJ as typeof GLOBAL_OBJ & Window;
19+
20+
/** Exported only for type safe tests. */
21+
export const _feedbackScreenshotIntegration = ((options: Partial<FeedbackScreenshotOptions> = {}) => {
22+
return {
23+
name: INTEGRATION_NAME,
24+
// eslint-disable-next-line @typescript-eslint/no-empty-function
25+
setupOnce() {},
26+
getOptions(): FeedbackScreenshotIntegrationOptions {
27+
return { el: options.el || WINDOW.document.createElement('div'), props: options.props || 'prop' };
28+
},
29+
renderScreenshotWidget: (options: FeedbackScreenshotOptions) => {
30+
return render(h(Hello, null), options.el);
31+
},
32+
};
33+
}) satisfies IntegrationFn;
34+
35+
/**
36+
* Add this in addition to `replayIntegration()` to enable canvas recording.
37+
*/
38+
export const feedbackScreenshotIntegration = defineIntegration(_feedbackScreenshotIntegration);
39+
40+
/**
41+
* @deprecated Use `feedbackScreenshotIntegration()` instead
42+
*/
43+
// eslint-disable-next-line deprecation/deprecation
44+
export const FeedbackScreenshot = convertIntegrationFnToClass(
45+
INTEGRATION_NAME,
46+
feedbackScreenshotIntegration,
47+
) as IntegrationClass<
48+
Integration & {
49+
getOptions: () => FeedbackScreenshotIntegrationOptions;
50+
renderScreenshotWidget: () => void;
51+
}
52+
>;

‎packages/feedback-screenshot/src/screenshotWidget.tsx

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import { h, render } from 'preact';
2+
3+
interface FeedbackScreenshotOptions {
4+
el: Element;
5+
props: string;
6+
}
7+
8+
// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
9+
export function Hello(options: FeedbackScreenshotOptions) {
10+
console.log('screenshot widget');
11+
return h('div', null, 'hello');
12+
}

‎packages/feedback-screenshot/tsconfig.json

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{
2+
"extends": "../../tsconfig.json",
3+
"compilerOptions": {
4+
"module": "esnext",
5+
6+
/* Preact Config */
7+
"jsx": "react-jsx",
8+
"jsxImportSource": "preact",
9+
"skipLibCheck": true,
10+
"baseUrl": "./",
11+
"paths": {
12+
"react": ["./node_modules/preact/compat/"],
13+
"react-dom": ["./node_modules/preact/compat/"]
14+
}
15+
},
16+
"include": ["src/**/*.ts"]
17+
}

‎packages/feedback-screenshot/tsconfig.test.json

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
"extends": "./tsconfig.json",
3+
4+
"include": ["test/**/*.ts", "jest.config.ts", "jest.setup.ts"],
5+
6+
"compilerOptions": {
7+
"types": ["node", "jest"],
8+
"esModuleInterop": true,
9+
"allowJs": true,
10+
"noImplicitAny": true,
11+
"noImplicitThis": false,
12+
"strictNullChecks": true,
13+
"strictPropertyInitialization": false
14+
}
15+
}

‎packages/feedback-screenshot/tsconfig.types.json

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"extends": "./tsconfig.json",
3+
4+
"compilerOptions": {
5+
"declaration": true,
6+
"declarationMap": true,
7+
"emitDeclarationOnly": true,
8+
"outDir": "build/npm/types"
9+
}
10+
}

0 commit comments

Comments
 (0)