diff --git a/package-lock.json b/package-lock.json index 765be10c..8dfd8da8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16862,7 +16862,7 @@ "name": "@smileid/embed", "version": "1.4.4", "dependencies": { - "@sentry/browser": "^8.32.0", + "@sentry/browser": "^8.33.0", "@sentry/esbuild-plugin": "^2.22.3", "@smile_identity/smart-camera-web": "file:../smart-camera-web", "@smileid/web-components": "^1.0.0", diff --git a/packages/web-components/components/document/src/DocumentCaptureScreens.js b/packages/web-components/components/document/src/DocumentCaptureScreens.js index 6a1d6e56..2c478103 100644 --- a/packages/web-components/components/document/src/DocumentCaptureScreens.js +++ b/packages/web-components/components/document/src/DocumentCaptureScreens.js @@ -34,20 +34,23 @@ class DocumentCaptureScreens extends HTMLElement { this.innerHTML = ` ${styles(this.themeColor)}
- + - - + +
`; @@ -294,6 +297,10 @@ class DocumentCaptureScreens extends HTMLElement { : ''; } + get hideAttribution() { + return this.hasAttribute('hide-attribution') ? 'hide-attribution' : ''; + } + get themeColor() { return this.getAttribute('theme-color') || '#001096'; } diff --git a/packages/web-components/components/document/src/DocumentCaptureScreens.stories.js b/packages/web-components/components/document/src/DocumentCaptureScreens.stories.js index 44799211..7397786b 100644 --- a/packages/web-components/components/document/src/DocumentCaptureScreens.stories.js +++ b/packages/web-components/components/document/src/DocumentCaptureScreens.stories.js @@ -2,9 +2,11 @@ import './index'; const meta = { args: { + 'hide-attribution': false, 'theme-color': '#001096', }, argTypes: { + 'hide-attribution': { control: 'boolean' }, 'theme-color': { control: 'color' }, }, component: 'document-capture-screens', @@ -14,35 +16,35 @@ export default meta; export const DocumentCapture = { render: (args) => ` - + `, }; export const DocumentCaptureHiddenInstructions = { render: (args) => ` - + `, }; export const DocumentCaptureHideBackOfId = { render: (args) => ` - + `, }; export const DocumentCaptureAllowAttributes = { render: (args) => ` - + `, }; export const DocumentCaptureHideInstructionNBackOfId = { render: (args) => ` - + `, }; diff --git a/packages/web-components/components/selfie/src/SelfieCaptureScreens.stories.js b/packages/web-components/components/selfie/src/SelfieCaptureScreens.stories.js index 7f4d95b3..7d7ee0a3 100644 --- a/packages/web-components/components/selfie/src/SelfieCaptureScreens.stories.js +++ b/packages/web-components/components/selfie/src/SelfieCaptureScreens.stories.js @@ -1,7 +1,12 @@ import './SelfieCaptureScreens'; const meta = { + args: { + 'hide-attribution': false, + 'theme-color': '#001096', + }, argTypes: { + 'hide-attribution': { control: 'boolean' }, 'theme-color': { control: 'color' }, }, component: 'selfie-capture-screens', @@ -10,21 +15,15 @@ const meta = { export default meta; export const SelfieCaptureFlow = { - args: { - 'theme-color': '#001096', - }, render: (args) => ` - + `, }; export const SelfieCaptureFlowHiddenInstructions = { - args: { - 'theme-color': '#001096', - }, render: (args) => ` - + `, }; diff --git a/packages/web-components/components/smart-camera-web/src/SmartCameraWeb.stories.js b/packages/web-components/components/smart-camera-web/src/SmartCameraWeb.stories.js index 9fd85eb1..be703395 100644 --- a/packages/web-components/components/smart-camera-web/src/SmartCameraWeb.stories.js +++ b/packages/web-components/components/smart-camera-web/src/SmartCameraWeb.stories.js @@ -2,9 +2,11 @@ import './SmartCameraWeb'; const meta = { args: { + 'hide-attribution': false, 'theme-color': '#001096', }, argTypes: { + 'hide-attribution': { control: 'boolean' }, 'theme-color': { control: 'color' }, }, component: 'smart-camera-web', @@ -14,35 +16,35 @@ export default meta; export const SmartCameraWeb = { render: (args) => ` - + `, }; export const SmartCameraWebWithOutInstructions = { render: (args) => ` - + `, }; export const SmartCameraWebWithOutNavigation = { render: (args) => ` - + `, }; export const SmartCameraWebWithOutBackToHost = { render: (args) => ` - + `, }; export const SmartCameraWebWithOutBackId = { render: (args) => ` - + `, }; diff --git a/packages/web-components/cypress/e2e/smart-camera-web-attribution.cy.js b/packages/web-components/cypress/e2e/smart-camera-web-attribution.cy.js index 5a41ca9b..124c9156 100644 --- a/packages/web-components/cypress/e2e/smart-camera-web-attribution.cy.js +++ b/packages/web-components/cypress/e2e/smart-camera-web-attribution.cy.js @@ -1,5 +1,6 @@ describe('SmartCameraWeb', () => { it('shows attribution by default', () => { + cy.clock(); cy.visit('/smart-camera-web'); cy.get('smart-camera-web') .shadow() @@ -7,9 +8,123 @@ describe('SmartCameraWeb', () => { .shadow() .find('powered-by-smile-id') .should('be.visible'); + + cy.get('smart-camera-web') + .shadow() + .find('selfie-capture-instructions') + .shadow() + .find('#allow') + .click(); + + cy.get('smart-camera-web') + .shadow() + .find('selfie-capture') + .shadow() + .find('powered-by-smile-id') + .should('be.visible'); + + cy.get('smart-camera-web') + .shadow() + .find('selfie-capture') + .shadow() + .find('#start-image-capture') + .click(); + cy.tick(8000); + + cy.get('smart-camera-web') + .shadow() + .find('selfie-capture-review') + .shadow() + .find('powered-by-smile-id') + .should('be.visible'); + + cy.get('smart-camera-web') + .shadow() + .find('selfie-capture-review') + .shadow() + .find('#select-id-image') + .click(); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture-instructions#document-capture-instructions-front') + .shadow() + .find('powered-by-smile-id') + .should('be.visible'); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture-instructions#document-capture-instructions-front') + .shadow() + .find('#take-photo') + .click(); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture#document-capture-front') + .shadow() + .find('powered-by-smile-id') + .should('be.visible'); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture#document-capture-front') + .shadow() + .find('#capture-id-image') + .click(); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture-review#front-of-document-capture-review') + .shadow() + .find('powered-by-smile-id') + .should('be.visible'); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture-review#front-of-document-capture-review') + .shadow() + .find('#select-id-image') + .click(); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture-instructions#document-capture-instructions-back') + .shadow() + .find('powered-by-smile-id') + .should('be.visible'); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture-instructions#document-capture-instructions-back') + .shadow() + .find('#take-photo') + .click(); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture#document-capture-back') + .shadow() + .find('powered-by-smile-id') + .should('be.visible'); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture#document-capture-back') + .shadow() + .find('#capture-id-image') + .click(); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture-review#back-of-document-capture-review') + .shadow() + .find('powered-by-smile-id') + .should('be.visible'); }); it.only('hides attribution when `hide-attribution` attribute is passed', () => { + cy.clock(); cy.visit('/capture-back-of-id-hide-attribution'); cy.get('smart-camera-web') .shadow() @@ -17,5 +132,118 @@ describe('SmartCameraWeb', () => { .shadow() .get('powered-by-smile-id') .should('not.exist'); + + cy.get('smart-camera-web') + .shadow() + .find('selfie-capture-instructions') + .shadow() + .find('#allow') + .click(); + + cy.get('smart-camera-web') + .shadow() + .find('selfie-capture') + .shadow() + .get('powered-by-smile-id') + .should('not.exist'); + + cy.get('smart-camera-web') + .shadow() + .find('selfie-capture') + .shadow() + .find('#start-image-capture') + .click(); + cy.tick(8000); + + cy.get('smart-camera-web') + .shadow() + .find('selfie-capture-review') + .shadow() + .get('powered-by-smile-id') + .should('not.exist'); + + cy.get('smart-camera-web') + .shadow() + .find('selfie-capture-review') + .shadow() + .find('#select-id-image') + .click(); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture-instructions#document-capture-instructions-front') + .shadow() + .get('powered-by-smile-id') + .should('not.exist'); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture-instructions#document-capture-instructions-front') + .shadow() + .find('#take-photo') + .click(); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture#document-capture-front') + .shadow() + .get('powered-by-smile-id') + .should('not.exist'); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture#document-capture-front') + .shadow() + .find('#capture-id-image') + .click(); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture-review#front-of-document-capture-review') + .shadow() + .get('powered-by-smile-id') + .should('not.exist'); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture-review#front-of-document-capture-review') + .shadow() + .find('#select-id-image') + .click(); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture-instructions#document-capture-instructions-back') + .shadow() + .get('powered-by-smile-id') + .should('not.exist'); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture-instructions#document-capture-instructions-back') + .shadow() + .find('#take-photo') + .click(); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture#document-capture-back') + .shadow() + .get('powered-by-smile-id') + .should('not.exist'); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture#document-capture-back') + .shadow() + .find('#capture-id-image') + .click(); + + cy.get('smart-camera-web') + .shadow() + .find('document-capture-review#back-of-document-capture-review') + .shadow() + .get('powered-by-smile-id') + .should('not.exist'); }); });