@playkit-js/hotspots 3.1.4 → 3.1.5-canary.2-c2142fd

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@playkit-js/hotspots",
-  "version": "3.1.4",
+  "version": "3.1.5-canary.2-c2142fd",
   "private": false,
   "bugs": {
     "url": "https://github.com/kaltura/playkit-js-hotspots/issues"
@@ -11,31 +11,30 @@
     "url": "git+https://github.com/kaltura/playkit-js-hotspots.git"
   },
   "dependencies": {
-    "@playkit-js/common": "^1.1.1"
+    "@playkit-js/common": "^1.2.4"
   },
   "devDependencies": {
-    "@typescript-eslint/eslint-plugin": "^5.23.0",
-    "@typescript-eslint/parser": "^5.23.0",
+    "@playkit-js/kaltura-player-js": "canary",
     "conventional-github-releaser": "3.1.3",
     "cross-env": "^7.0.3",
     "css-loader": "^6.7.1",
-    "eslint": "^6.6.0",
-    "jest": "^28.1.0",
-    "kaltura-player-js": "https://github.com/kaltura/kaltura-player-js.git#master",
-    "lint-staged": "^12.4.1",
+    "cypress": "^12.12.0",
+    "playwright-webkit": "^1.33.0",
     "prettier": "^2.6.2",
     "sass": "^1.52.3",
     "sass-loader": "^12.6.0",
     "standard-version": "^9.3.2",
     "style-loader": "1.3.0",
     "ts-loader": "^9.3.0",
-    "tslint": "^6.1.3",
-    "typescript": "^4.6.4",
+    "typescript": "^4.9.4",
     "uglifyjs-webpack-plugin": "^2.2.0",
     "webpack": "^5.72.1",
     "webpack-cli": "^4.9.2",
     "webpack-dev-server": "^4.9.0"
   },
+  "peerDependencies": {
+    "@playkit-js/kaltura-player-js": "canary"
+  },
   "license": "AGPL-3.0",
   "files": [
     "dist",
@@ -50,12 +49,19 @@
     "build": "webpack --mode production",
     "dev": "webpack-dev-server --mode development",
     "watch": "webpack --progress --color --watch --mode development",
-    "test": "jest",
+    "cypress:open": "cypress open",
+    "cypress:run": "cypress run",
+    "cy:open": "cypress open",
+    "cy:run": "yarn run cy:run:chrome && yarn run cy:run:firefox && yarn run cy:run:edge && yarn run cy:run:safari",
+    "cy:run:chrome": "cypress run --browser chrome --config video=false",
+    "cy:run:firefox": "cypress run --browser firefox --config video=false",
+    "cy:run:edge": "cypress run --browser edge --config video=false",
+    "cy:run:safari": "cypress run --browser webkit --config video=false",
+    "test:prepare": "yarn run build && yes | cp -i ./dist/playkit-hotspots.js ./cypress/public/plugin.js",
+    "test:watch": "yarn run test:prepare && cypress open",
+    "test": "yarn run test:prepare && yarn run cy:run",
     "release": "standard-version",
     "pushTaggedRelease": "git push --follow-tags --no-verify origin master",
-    "eslint": "eslint . --color",
-    "commit:dist": "git add --force --all dist && (git commit -m 'chore: update dist' || exit 0)",
-    "precommit": "lint-staged",
     "prettier:fix": "prettier --write ."
   },
   "publishConfig": {
@@ -76,7 +82,7 @@
   "kaltura": {
     "name": "playkit-js-hotspots",
     "dependencies": {
-      "playkit-kaltura-cuepoints": "3.0.4"
+      "playkit-kaltura-cuepoints": "3.0.5"
     }
   }
 }

package/src/components/Hotspot.tsx

@@ -173,7 +173,7 @@ export default class Hotspot extends Component<Props, State> {
 
     return (
       <A11yWrapper onClick={this.handleClick}>
-        <div tabIndex={0} aria-label={label} aria-disabled={disableClick} style={containerStyles}>
+        <div tabIndex={0} aria-label={label} aria-disabled={disableClick} style={containerStyles} data-testid="hotspots_hotspot">
           <div style={buttonStyles}>{label}</div>
         </div>
       </A11yWrapper>

package/src/components/HotspotWrapper.tsx

@@ -40,6 +40,10 @@ export default class HotspotWrapper extends Component<Props> {
     const {hotspots} = this.props;
     const hotspotsElements = this.renderHotspots(hotspots);
 
-    return <div style={hotspotsContainerStyles}>{hotspotsElements}</div>;
+    return (
+      <div style={hotspotsContainerStyles} data-testid="hotspots_hotspotsContainer">
+        {hotspotsElements}
+      </div>
+    );
   }
 }