Fix tests!

AshesOfOwls · Sep 20, 2017 · 4f9215c · 4f9215c
1 parent 8c06310
commit 4f9215c
Show file tree

Hide file tree

Showing 9 changed files with 538 additions and 502 deletions.
diff --git a/dist/popover.js b/dist/popover.js
@@ -202,6 +202,26 @@ var error = function error(message) {
   throw new Error(message);
 };
 
+var generateOptionClassnames = function generateOptionClassnames(options) {
+  if (options.classes) {
+    return Object.assign({}, options);
+  }
+
+  var prefix = options.classPrefix;
+
+  return Object.assign({}, options, {
+    classes: {
+      theme: prefix + '--' + options.themeClass,
+      constrained: prefix + '--is-constrained',
+      detachedContainer: prefix + '--detached-container',
+      content: prefix + '-content',
+      arrow: prefix + '-arrow',
+      isVisible: prefix + '--is-visible',
+      isOpen: prefix + '--is-open'
+    }
+  });
+};
+
 exports.oneEvent = oneEvent;
 exports.addClass = addClass;
 exports.error = error;
@@ -212,6 +232,7 @@ exports.setHalfPointsOnOrigin = setHalfPointsOnOrigin;
 exports.getWindowOrigin = getWindowOrigin;
 exports.whichTransitionEvent = whichTransitionEvent;
 exports.toggleClassesOnElement = toggleClassesOnElement;
+exports.generateOptionClassnames = generateOptionClassnames;
 
 /***/ }),
 /* 1 */
@@ -257,29 +278,13 @@ var defaults = {
   onAfterShow: function onAfterShow() {}
 };
 
-var generateOptionClassnames = function generateOptionClassnames(options) {
-  var prefix = options.classPrefix;
-
-  return Object.assign({}, options, {
-    classes: {
-      theme: prefix + '--' + options.themeClass,
-      constrained: prefix + '--is-constrained',
-      detachedContainer: prefix + '--detached-container',
-      arrow: prefix + '-content',
-      content: prefix + '-arrow',
-      isVisible: prefix + '--is-visible',
-      isOpen: prefix + '--is-open'
-    }
-  });
-};
-
 var requiredOptions = ['attachmentElement', 'popoverElement'];
 
 var Popoverjs = function () {
   function Popoverjs(options) {
     _classCallCheck(this, Popoverjs);
 
-    this.options = generateOptionClassnames(Object.assign({}, defaults, options));
+    this.options = (0, _utils.generateOptionClassnames)(Object.assign({}, defaults, options));
 
     this.checkForRequiredOptions();
     this.initialize();
@@ -795,7 +800,7 @@ var Renderer = function () {
   function Renderer(options) {
     _classCallCheck(this, Renderer);
 
-    this.options = Object.assign({}, defaults, options);
+    this.options = (0, _utils.generateOptionClassnames)(Object.assign({}, defaults, options));
 
     this.onTriggerClick = this.onTriggerClick.bind(this);
     this.onDocumentClick = this.onDocumentClick.bind(this);
@@ -1163,6 +1168,8 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 var defaults = {
+  classPrefix: 'popoverjs',
+  themeClass: 'default',
   bodyAttached: false,
   dynamicWidth: false,
   maintainAttachmentWidth: false,
@@ -1211,8 +1218,9 @@ var Positioner = function () {
   _createClass(Positioner, [{
     key: 'generateOptions',
     value: function generateOptions(options) {
-      this.options = Object.assign({}, defaults, options);
-      var classPrefix = options.classPrefix;
+      this.options = (0, _utils.generateOptionClassnames)(Object.assign({}, defaults, options));
+
+      var classPrefix = this.options.classPrefix;
 
       Object.assign(this.options.classes, {
         sizer: generateSizerClasses(classPrefix)
@@ -1404,9 +1412,12 @@ var Positioner = function () {
         className += ' ' + this.options.customClass;
       }
 
-      if (this.options.themeClass) {
+      console.log('IS THERE AN ACUTALY ASDSD', this.options.classes.theme);
+
+      if (this.options.classes.theme) {
         className += ' ' + this.options.classes.theme;
       }
+      console.log("CLASS NAME TURNS OUT TO BE", className);
 
       this.popoverElement.className = className;
     }

diff --git a/karma.conf.js b/karma.conf.js
@@ -12,10 +12,18 @@ module.exports = (config) => {
     files: [
       'tests/**/*.test.js',
       'tests/**/*.test.jsx',
+      'src/styles/*.scss',
     ],
     preprocessors: {
       'tests/**/*.test.js': ['webpack'],
       'tests/**/*.test.jsx': ['webpack'],
+      'src/styles/*.scss': ['scss'],
+    },
+    scssPreprocessor: {
+      options: {
+        sourceMap: true,
+        includePaths: ['bower_components'],
+      },
     },
     webpack: webpackConfig,
     reporters: ['mocha'],

diff --git a/package.json b/package.json
@@ -37,6 +37,7 @@
     "karma-chrome-launcher": "^2.2.0",
     "karma-jasmine": "^1.1.0",
     "karma-mocha-reporter": "^2.2.3",
+    "karma-scss-preprocessor": "^3.0.0",
     "karma-webpack": "^2.0.4",
     "node-sass": "^4.5.3",
     "sass-loader": "^6.0.6",

diff --git a/src/index.js b/src/index.js
@@ -3,7 +3,7 @@ import './polyfills';
 import Renderer from './renderer';
 import Positioner from './positioner';
 
-import { error } from './utils';
+import { error, generateOptionClassnames } from './utils';
 
 import './styles/_main.scss';
 
@@ -20,22 +20,6 @@ const defaults = {
   onAfterShow: () => {},
 };
 
-const generateOptionClassnames = (options) => {
-  const prefix = options.classPrefix;
-
-  return Object.assign({}, options, {
-    classes: {
-      theme: `${prefix}--${options.themeClass}`,
-      constrained: `${prefix}--is-constrained`,
-      detachedContainer: `${prefix}--detached-container`,
-      arrow: `${prefix}-content`,
-      content: `${prefix}-arrow`,
-      isVisible: `${prefix}--is-visible`,
-      isOpen: `${prefix}--is-open`,
-    },
-  });
-};
-
 const requiredOptions = [
   'attachmentElement',
   'popoverElement',

diff --git a/src/positioner.js b/src/positioner.js
@@ -1,7 +1,9 @@
 import documentOffset from 'document-offset';
-import { toggleClassesOnElement, getElementOrigin, getWindowOrigin, throttle } from './utils';
+import { toggleClassesOnElement, getElementOrigin, getWindowOrigin, throttle, generateOptionClassnames } from './utils';
 
 const defaults = {
+  classPrefix: 'popoverjs',
+  themeClass: 'default',
   bodyAttached: false,
   dynamicWidth: false,
   maintainAttachmentWidth: false,
@@ -52,8 +54,9 @@ class Positioner {
   }
 
   generateOptions(options) {
-    this.options = Object.assign({}, defaults, options);
-    const classPrefix = options.classPrefix;
+    this.options = generateOptionClassnames(Object.assign({}, defaults, options));
+
+    const classPrefix = this.options.classPrefix;
 
     Object.assign(this.options.classes, {
       sizer: generateSizerClasses(classPrefix),
@@ -131,6 +134,7 @@ class Positioner {
 
     this.togglePopoverClasses(sizerClasses, true);
 
+
     this.cssCache = {
       arrowSize: this.getArrowSize(),
       contentSize: this.getContentSize(),
@@ -140,6 +144,7 @@ class Positioner {
       body: getBodyOffsets(),
     };
 
+
     this.togglePopoverClasses(sizerClasses, false);
   }
 
@@ -220,9 +225,12 @@ class Positioner {
       className += ` ${this.options.customClass}`;
     }
 
-    if (this.options.themeClass) {
+    console.log('IS THERE AN ACUTALY ASDSD', this.options.classes.theme);
+
+    if (this.options.classes.theme) {
       className += ` ${this.options.classes.theme}`;
     }
+    console.log("CLASS NAME TURNS OUT TO BE", className);
 
     this.popoverElement.className = className;
   }

diff --git a/src/renderer.js b/src/renderer.js
@@ -1,4 +1,4 @@
-import { oneEvent, toggleClassesOnElement, whichTransitionEvent } from './utils';
+import { oneEvent, toggleClassesOnElement, whichTransitionEvent, generateOptionClassnames } from './utils';
 
 const defaults = {
   manualTriggering: false,
@@ -10,7 +10,7 @@ const defaults = {
 
 class Renderer {
   constructor(options) {
-    this.options = Object.assign({}, defaults, options);
+    this.options = generateOptionClassnames(Object.assign({}, defaults, options));
 
     this.onTriggerClick = this.onTriggerClick.bind(this);
     this.onDocumentClick = this.onDocumentClick.bind(this);

diff --git a/src/utils.js b/src/utils.js
@@ -112,6 +112,26 @@ const error = (message) => {
   throw new Error(message);
 };
 
+const generateOptionClassnames = (options) => {
+  if (options.classes) {
+    return Object.assign({}, options);
+  }
+
+  const prefix = options.classPrefix;
+
+  return Object.assign({}, options, {
+    classes: {
+      theme: `${prefix}--${options.themeClass}`,
+      constrained: `${prefix}--is-constrained`,
+      detachedContainer: `${prefix}--detached-container`,
+      content: `${prefix}-content`,
+      arrow: `${prefix}-arrow`,
+      isVisible: `${prefix}--is-visible`,
+      isOpen: `${prefix}--is-open`,
+    },
+  });
+};
+
 export {
   oneEvent,
   addClass,
@@ -123,4 +143,5 @@ export {
   getWindowOrigin,
   whichTransitionEvent,
   toggleClassesOnElement,
+  generateOptionClassnames,
 };