Refactor and update dependencies

.babelrc

@@ -0,0 +1,14 @@
+{
+  "presets": [
+    [
+      "@babel/preset-env",
+      {
+        "useBuiltIns": "usage"
+      }
+    ]
+  ],
+  "plugins": [
+    "babel-plugin-add-module-exports",
+    "@babel/plugin-proposal-object-rest-spread"
+  ]
+}

config/webpack.config.demo.js

@@ -11,7 +11,6 @@ module.exports = {
   entry: [
     'webpack-dev-server/client?http://localhost:3000',
     './demo/styles/demo.scss',
-    './demo/scripts/emoji.js',
     './demo/scripts/demo.js',
     './src/index.js',
   ],
@@ -38,20 +37,6 @@ module.exports = {
         test: /\.js$/,
         exclude: /node_modules/,
         loader: 'babel-loader',
-        options: {
-          presets: [
-            [
-              'env',
-              {
-                useBuiltIns: 'usage',
-              },
-            ],
-          ],
-          plugins: [
-            'babel-plugin-add-module-exports',
-            'transform-object-rest-spread',
-          ],
-        },
       },
       {
         test: /.scss$/,

config/webpack.config.prod.js

@@ -30,20 +30,6 @@ module.exports = {
         test: /\.js$/,
         exclude: /node_modules/,
         loader: 'babel-loader',
-        options: {
-          presets: [
-            [
-              'env',
-              {
-                useBuiltIns: 'usage',
-              },
-            ],
-          ],
-          plugins: [
-            'babel-plugin-add-module-exports',
-            'transform-object-rest-spread',
-          ],
-        },
       },
       {
         test: /.scss$/,

demo/scripts/demo.js

@@ -1,6 +1,7 @@
 /* eslint-disable */
-document.addEventListener('DOMContentLoaded', function () {
+import Driver from '../../src';
 
+document.addEventListener('DOMContentLoaded', function () {
   const tourSteps = [
     {
       element: document.getElementById('driver-demo-head'),

demo/scripts/emoji.js

@@ -1,28 +0,0 @@
-// Just for the sake of styling page
-/* eslint-disable */
-
-/**
- * Determine if this browser supports emoji.
- *
- * Modified from https://gist.github.com/mwunsch/4710561
- * and probobly originally github's javascript source
- */
-function doesSupportEmoji() {
-  let context;
-  if (!document.createElement('canvas').getContext) return;
-  context = document.createElement('canvas').getContext('2d');
-  if ((typeof context.fillText) !== 'function') {
-    return;
-  }
-
-  let smile = String.fromCharCode(55357) + String.fromCharCode(56835);
-
-  context.textBaseline = "top";
-  context.font = "32px Arial";
-  context.fillText(smile, 0, 0);
-  return context.getImageData(16, 16, 1, 1).data[0] !== 0;
-}
-
-if (!doesSupportEmoji()) {
-  twemoji.parse(document.body);
-}

package.json

@@ -17,29 +17,29 @@
   "author": "Kamran Ahmed <kamranahmed.se@gmail.com>",
   "license": "MIT",
   "devDependencies": {
-    "babel-core": "^6.26.0",
-    "babel-eslint": "^8.2.2",
-    "babel-loader": "^7.1.3",
-    "babel-plugin-add-module-exports": "^0.2.1",
-    "babel-plugin-transform-object-rest-spread": "^6.26.0",
-    "babel-preset-env": "^1.6.1",
+    "@babel/core": "^7.0.0",
+    "@babel/plugin-proposal-object-rest-spread": "^7.0.0",
+    "@babel/preset-env": "^7.0.0",
+    "babel-eslint": "^10.0.1",
+    "babel-loader": "^8.0.0",
+    "babel-plugin-add-module-exports": "^1.0.0",
     "copy-webpack-plugin": "^4.5.1",
-    "css-loader": "^0.28.10",
-    "eslint": "^4.18.2",
-    "eslint-config-airbnb-base": "^12.1.0",
+    "css-loader": "^1.0.0",
+    "eslint": "^5.6.1",
+    "eslint-config-airbnb-base": "^13.1.0",
     "eslint-loader": "^2.0.0",
     "eslint-plugin-import": "^2.9.0",
-    "eslint-plugin-node": "^6.0.1",
-    "extract-loader": "^1.0.2",
+    "eslint-plugin-node": "^7.0.1",
+    "extract-loader": "^3.0.0",
     "extract-text-webpack-plugin": "next",
-    "file-loader": "^1.1.11",
+    "file-loader": "^2.0.0",
     "node-sass": "^4.7.2",
     "opn": "^5.2.0",
-    "postcss-loader": "^2.1.1",
-    "sass-loader": "^6.0.7",
-    "style-loader": "^0.20.2",
+    "postcss-loader": "^3.0.0",
+    "sass-loader": "^7.1.0",
+    "style-loader": "^0.23.1",
     "webpack": "^4.0.1",
-    "webpack-cli": "^2.0.10",
+    "webpack-cli": "^3.1.2",
     "webpack-dev-server": "^3.1.0"
   },
   "dependencies": {}

src/core/element.js

@@ -62,10 +62,10 @@ export default class Element {
     }
 
     return (
-      top >= this.window.pageYOffset &&
-      left >= this.window.pageXOffset &&
-      (top + height) <= (this.window.pageYOffset + this.window.innerHeight) &&
-      (left + width) <= (this.window.pageXOffset + this.window.innerWidth)
+      top >= this.window.pageYOffset
+      && left >= this.window.pageXOffset
+      && (top + height) <= (this.window.pageYOffset + this.window.innerHeight)
+      && (left + width) <= (this.window.pageXOffset + this.window.innerWidth)
     );
   }
 
@@ -267,13 +267,13 @@ export default class Element {
       // - Opacity is below 0
       // - Filter/transform or perspective is applied
       if (
-        /[0-9]+/.test(zIndex) ||
-        opacity < 1 ||
-        (transform && transform !== 'none') ||
-        (transformStyle && transformStyle !== 'flat') ||
-        (transformBox && transformBox !== 'border-box') ||
-        (filter && filter !== 'none') ||
-        (perspective && perspective !== 'none')
+        /[0-9]+/.test(zIndex)
+        || opacity < 1
+        || (transform && transform !== 'none')
+        || (transformStyle && transformStyle !== 'flat')
+        || (transformBox && transformBox !== 'border-box')
+        || (filter && filter !== 'none')
+        || (perspective && perspective !== 'none')
       ) {
         parentNode.classList.add(CLASS_FIX_STACKING_CONTEXT);
       }

src/core/position.js

@@ -29,17 +29,4 @@ export default class Position {
   canHighlight() {
     return this.left < this.right && this.top < this.bottom;
   }
-
-  /**
-   * Checks if the given position is equal to the passed position
-   * @param position Position
-   * @returns {boolean}
-   * @public
-   */
-  equals(position) {
-    return Math.round(this.left) === Math.round(position.left) &&
-      Math.round(this.right) === Math.round(position.right) &&
-      Math.round(this.top) === Math.round(position.top) &&
-      Math.round(this.bottom) === Math.round(position.bottom);
-  }
 }

src/core/stage.js

@@ -90,4 +90,3 @@ export default class Stage extends Element {
     this.node.style.backgroundColor = this.options.stageBackground;
   }
 }
-