diff --git a/player/index.html b/player/index.html
index 6f53dde..b17f656 100644
--- a/player/index.html
+++ b/player/index.html
@@ -12,7 +12,7 @@
         }
 
         #lottie{
-            background-color:#ddd;
+            background-color:#000;
             width:600px;
             height:400px;
             display:block;
@@ -32,6 +32,7 @@
     <script src="js/utils/helpers/html_elements.js"></script>
     <script src="js/utils/helpers/dynamicProperties.js"></script>
     <script src="js/utils/helpers/blendModes.js"></script>
+    <script src="js/utils/helpers/shapeEnums.js"></script>
     <script src="js/3rd_party/transformation-matrix.js"></script>
     <script src="js/3rd_party/seedrandom.js"></script>
     <script src="js/3rd_party/BezierEaser.js"></script>
diff --git a/player/js/elements/ShapeElement.js b/player/js/elements/ShapeElement.js
index bd829ca..84c25c7 100644
--- a/player/js/elements/ShapeElement.js
+++ b/player/js/elements/ShapeElement.js
@@ -42,16 +42,7 @@
       }
     }
   },
-  lcEnum: {
-    1: 'butt',
-    2: 'round',
-    3: 'square',
-  },
-  ljEnum: {
-    1: 'miter',
-    2: 'round',
-    3: 'bevel',
-  },
+
   searchProcessedElement: function (elem) {
     var elements = this.processedElements;
     var i = 0;
diff --git a/player/js/elements/canvasElements/CVShapeElement.js b/player/js/elements/canvasElements/CVShapeElement.js
index 5e56c82..22b6975 100644
--- a/player/js/elements/canvasElements/CVShapeElement.js
+++ b/player/js/elements/canvasElements/CVShapeElement.js
@@ -1,6 +1,6 @@
 /* global ShapeTransformManager, extendPrototype, BaseElement, TransformElement, CVBaseElement, IShapeElement,
 HierarchyElement, FrameElement, RenderableElement, RenderableDOMElement, PropertyFactory, degToRads, GradientProperty,
-DashProperty, TransformPropertyFactory, CVShapeData, ShapeModifiers, bmFloor */
+DashProperty, TransformPropertyFactory, CVShapeData, ShapeModifiers, bmFloor, lineCapEnum, lineJoinEnum */
 
 function CVShapeElement(data, globalData, comp) {
   this.shapes = [];
@@ -50,8 +50,8 @@
   }
   elementData.o = PropertyFactory.getProp(this, data.o, 0, 0.01, this);
   if (data.ty === 'st' || data.ty === 'gs') {
-    styleElem.lc = this.lcEnum[data.lc] || 'round';
-    styleElem.lj = this.ljEnum[data.lj] || 'round';
+    styleElem.lc = lineCapEnum[data.lc || 2];
+    styleElem.lj = lineJoinEnum[data.lj || 2];
     if (data.lj == 1) { // eslint-disable-line eqeqeq
       styleElem.ml = data.ml;
     }
diff --git a/player/js/elements/helpers/shapes/SVGGradientFillStyleData.js b/player/js/elements/helpers/shapes/SVGGradientFillStyleData.js
index fd75d73..9452eb5 100644
--- a/player/js/elements/helpers/shapes/SVGGradientFillStyleData.js
+++ b/player/js/elements/helpers/shapes/SVGGradientFillStyleData.js
@@ -1,5 +1,5 @@
 /* global PropertyFactory, degToRads, GradientProperty, createElementID, createNS, locationHref,
-extendPrototype, DynamicPropertyContainer */
+extendPrototype, DynamicPropertyContainer, lineCapEnum, lineJoinEnum */
 
 function SVGGradientFillStyleData(elem, data, styleOb) {
   this.initDynamicPropertyContainer(elem);
@@ -38,7 +38,6 @@
     stops.push(stop);
   }
   pathElement.setAttribute(data.ty === 'gf' ? 'fill' : 'stroke', 'url(' + locationHref + '#' + gradientId + ')');
-
   this.gf = gfill;
   this.cst = stops;
 };
@@ -67,6 +66,13 @@
       stops.push(stop);
     }
     maskElement.setAttribute(data.ty === 'gf' ? 'fill' : 'stroke', 'url(' + locationHref + '#' + opacityId + ')');
+    if (data.ty === 'gs') {
+      maskElement.setAttribute('stroke-linecap', lineCapEnum[data.lc || 2]);
+      maskElement.setAttribute('stroke-linejoin', lineJoinEnum[data.lj || 2]);
+      if (data.lj === 1) {
+        maskElement.setAttribute('stroke-miterlimit', data.ml);
+      }
+    }
     this.of = opFill;
     this.ms = mask;
     this.ost = stops;
diff --git a/player/js/elements/htmlElements/HTextElement.js b/player/js/elements/htmlElements/HTextElement.js
index 96f7221..2e87a2c 100644
--- a/player/js/elements/htmlElements/HTextElement.js
+++ b/player/js/elements/htmlElements/HTextElement.js
@@ -1,5 +1,5 @@
 /* global extendPrototype, BaseElement, TransformElement, HBaseElement, HierarchyElement, FrameElement,
-RenderableDOMElement, ITextElement, createSizedArray, createTag, styleDiv, createNS */
+RenderableDOMElement, ITextElement, createSizedArray, createTag, styleDiv, createNS, lineJoinEnum, lineCapEnum */
 
 function HTextElement(data, globalData, comp) {
   this.textSpans = [];
@@ -76,8 +76,8 @@
     if (this.globalData.fontManager.chars) {
       if (!this.textPaths[cnt]) {
         tSpan = createNS('path');
-        tSpan.setAttribute('stroke-linecap', 'butt');
-        tSpan.setAttribute('stroke-linejoin', 'round');
+        tSpan.setAttribute('stroke-linecap', lineCapEnum[1]);
+        tSpan.setAttribute('stroke-linejoin', lineJoinEnum[2]);
         tSpan.setAttribute('stroke-miterlimit', '4');
       } else {
         tSpan = this.textPaths[cnt];
diff --git a/player/js/elements/svgElements/SVGShapeElement.js b/player/js/elements/svgElements/SVGShapeElement.js
index db9ef01..29d9e74 100644
--- a/player/js/elements/svgElements/SVGShapeElement.js
+++ b/player/js/elements/svgElements/SVGShapeElement.js
@@ -1,7 +1,8 @@
 /* global extendPrototype, BaseElement, TransformElement, SVGBaseElement, IShapeElement, HierarchyElement,
 FrameElement, RenderableDOMElement, Matrix, SVGStyleData, SVGStrokeStyleData, SVGFillStyleData,
 SVGGradientFillStyleData, SVGGradientStrokeStyleData, locationHref, getBlendMode, ShapeGroupData,
-TransformPropertyFactory, SVGTransformData, ShapePropertyFactory, SVGShapeData, SVGElementsRenderer, ShapeModifiers */
+TransformPropertyFactory, SVGTransformData, ShapePropertyFactory, SVGShapeData, SVGElementsRenderer, ShapeModifiers,
+lineCapEnum, lineJoinEnum */
 
 function SVGShapeElement(data, globalData, comp) {
   // List of drawable elements
@@ -98,8 +99,8 @@
   }
 
   if (data.ty === 'st' || data.ty === 'gs') {
-    pathElement.setAttribute('stroke-linecap', this.lcEnum[data.lc] || 'round');
-    pathElement.setAttribute('stroke-linejoin', this.ljEnum[data.lj] || 'round');
+    pathElement.setAttribute('stroke-linecap', lineCapEnum[data.lc || 2]);
+    pathElement.setAttribute('stroke-linejoin', lineJoinEnum[data.lj || 2]);
     pathElement.setAttribute('fill-opacity', '0');
     if (data.lj === 1) {
       pathElement.setAttribute('stroke-miterlimit', data.ml);
diff --git a/player/js/utils/BaseEvent.js b/player/js/utils/BaseEvent.js
index 90cef4c..3612690 100644
--- a/player/js/utils/BaseEvent.js
+++ b/player/js/utils/BaseEvent.js
@@ -2,9 +2,9 @@
 BaseEvent.prototype = {
   triggerEvent: function (eventName, args) {
     if (this._cbs[eventName]) {
-      var len = this._cbs[eventName].length;
-      for (var i = 0; i < len; i += 1) {
-        this._cbs[eventName][i](args);
+      var callbacks = this._cbs[eventName];
+      for (var i = 0; i < callbacks.length; i += 1) {
+        callbacks[i](args);
       }
     }
   },
diff --git a/player/js/utils/expressions/TextSelectorPropertyDecorator.js b/player/js/utils/expressions/TextSelectorPropertyDecorator.js
index 0e28554..f7f9519 100644
--- a/player/js/utils/expressions/TextSelectorPropertyDecorator.js
+++ b/player/js/utils/expressions/TextSelectorPropertyDecorator.js
@@ -1,43 +1,41 @@
 /* global expressionHelpers, TextSelectorProp, ExpressionManager */
-/* exported TextExpressionSelectorProp */
+/* exported TextExpressionSelectorPropFactory */
 
-(function () {
-  var TextExpressionSelectorProp = (function () { // eslint-disable-line no-unused-vars
-    function getValueProxy(index, total) {
-      this.textIndex = index + 1;
-      this.textTotal = total;
-      this.v = this.getValue() * this.mult;
-      return this.v;
+var TextExpressionSelectorPropFactory = (function () { // eslint-disable-line no-unused-vars
+  function getValueProxy(index, total) {
+    this.textIndex = index + 1;
+    this.textTotal = total;
+    this.v = this.getValue() * this.mult;
+    return this.v;
+  }
+
+  return function (elem, data) {
+    this.pv = 1;
+    this.comp = elem.comp;
+    this.elem = elem;
+    this.mult = 0.01;
+    this.propType = 'textSelector';
+    this.textTotal = data.totalChars;
+    this.selectorValue = 100;
+    this.lastValue = [1, 1, 1];
+    this.k = true;
+    this.x = true;
+    this.getValue = ExpressionManager.initiateExpression.bind(this)(elem, data, this);
+    this.getMult = getValueProxy;
+    this.getVelocityAtTime = expressionHelpers.getVelocityAtTime;
+    if (this.kf) {
+      this.getValueAtTime = expressionHelpers.getValueAtTime.bind(this);
+    } else {
+      this.getValueAtTime = expressionHelpers.getStaticValueAtTime.bind(this);
     }
-
-    return function TextExpressionSelectorPropFactory(elem, data) {
-      this.pv = 1;
-      this.comp = elem.comp;
-      this.elem = elem;
-      this.mult = 0.01;
-      this.propType = 'textSelector';
-      this.textTotal = data.totalChars;
-      this.selectorValue = 100;
-      this.lastValue = [1, 1, 1];
-      this.k = true;
-      this.x = true;
-      this.getValue = ExpressionManager.initiateExpression.bind(this)(elem, data, this);
-      this.getMult = getValueProxy;
-      this.getVelocityAtTime = expressionHelpers.getVelocityAtTime;
-      if (this.kf) {
-        this.getValueAtTime = expressionHelpers.getValueAtTime.bind(this);
-      } else {
-        this.getValueAtTime = expressionHelpers.getStaticValueAtTime.bind(this);
-      }
-      this.setGroupProperty = expressionHelpers.setGroupProperty;
-    };
-  }());
-
-  var propertyGetTextProp = TextSelectorProp.getTextSelectorProp;
-  TextSelectorProp.getTextSelectorProp = function (elem, data, arr) {
-    if (data.t === 1) {
-      return new TextExpressionSelectorPropFactory(elem, data, arr); // eslint-disable-line no-undef
-    }
-    return propertyGetTextProp(elem, data, arr);
+    this.setGroupProperty = expressionHelpers.setGroupProperty;
   };
 }());
+
+var propertyGetTextProp = TextSelectorProp.getTextSelectorProp;
+TextSelectorProp.getTextSelectorProp = function (elem, data, arr) {
+  if (data.t === 1) {
+    return new TextExpressionSelectorPropFactory(elem, data, arr); // eslint-disable-line no-undef
+  }
+  return propertyGetTextProp(elem, data, arr);
+};
diff --git a/player/js/utils/helpers/shapeEnums.js b/player/js/utils/helpers/shapeEnums.js
new file mode 100644
index 0000000..3833acb
--- /dev/null
+++ b/player/js/utils/helpers/shapeEnums.js
@@ -0,0 +1,13 @@
+/* exported lineCapEnum, lineJoinEnum */
+
+var lineCapEnum = {
+  1: 'butt',
+  2: 'round',
+  3: 'square',
+};
+
+var lineJoinEnum = {
+  1: 'miter',
+  2: 'round',
+  3: 'bevel',
+};
diff --git a/tasks/build.js b/tasks/build.js
index dd18108..14ccf55 100644
--- a/tasks/build.js
+++ b/tasks/build.js
@@ -40,6 +40,10 @@
 		builds: defaultBuilds
 	},
 	{
+		src: 'js/utils/helpers/shapeEnums.js',
+		builds: defaultBuilds
+	},
+	{
 		src: 'js/3rd_party/transformation-matrix.js',
 		builds: defaultBuilds
 	},