From cbf163279b9143848764a9574bf06219d1a3fae3 Mon Sep 17 00:00:00 2001
From: "Manu Mtz.-Almeida" <manu.mtza@gmail.com>
Date: Sat, 28 Apr 2018 15:29:42 +0200
Subject: [PATCH] test(theme): adds tests for getClassMap()

---
 core/src/utils/test/theme.spec.ts | 80 +++++++++++++++++++++----------
 core/src/utils/theme.ts           |  9 ++--
 2 files changed, 58 insertions(+), 31 deletions(-)

diff --git a/core/src/utils/test/theme.spec.ts b/core/src/utils/test/theme.spec.ts
index 0e3799f0e0..12a78bf7a2 100644
--- a/core/src/utils/test/theme.spec.ts
+++ b/core/src/utils/test/theme.spec.ts
@@ -1,32 +1,62 @@
-import { getClassList } from '../theme';
+import { getClassList, getClassMap } from '../theme';
 
-describe('theme utils', () => {
-  describe('getClassList()', () => {
-    it('should parse string', () => {
-      expect(getClassList(' class class-event     THEME-ios-bar-button')).toEqual([
-        'class', 'class-event', 'THEME-ios-bar-button'
-      ]);
-      expect(getClassList('')).toEqual([]);
-      expect(getClassList('  ')).toEqual([]);
+describe('getClassList()', () => {
+  it('should parse string', () => {
+    expect(getClassList(' class class-event     THEME-ios-bar-button')).toEqual([
+      'class', 'class-event', 'THEME-ios-bar-button'
+    ]);
+    expect(getClassList('')).toEqual([]);
+    expect(getClassList('  ')).toEqual([]);
+  });
+
+  it('should pass array', () => {
+    expect(getClassList([
+      'class', 'class-event', 'THEME-ios-bar-button'
+    ])).toEqual([
+      'class', 'class-event', 'THEME-ios-bar-button'
+    ]);
+    expect(getClassList([
+      'class   ', '   class-event', '  THEME-ios-bar-button  '
+    ])).toEqual([
+      'class', 'class-event', 'THEME-ios-bar-button'
+    ]);
+
+    expect(getClassList([
+      'class   ', null, undefined, '', '   class-event', '  ', '  THEME-ios-bar-button  '
+    ] as any)).toEqual([
+      'class', 'class-event', 'THEME-ios-bar-button'
+    ]);
+  });
+});
+
+describe('getClassMap()', () => {
+  it('should parse string', () => {
+    expect(getClassMap(' class class-event     THEME-ios-bar-button')).toEqual({
+      class: true,
+      'class-event': true,
+      'THEME-ios-bar-button': true,
+    });
+    expect(getClassMap('')).toEqual({});
+    expect(getClassMap('  ')).toEqual({});
+  });
+
+  it('should pass array', () => {
+    expect(getClassMap([
+      'class', 'class-event', 'THEME-ios-bar-button'
+    ])).toEqual({
+      'class': true, 'class-event': true, 'THEME-ios-bar-button': true
     });
 
-    it('should pass array', () => {
-      expect(getClassList([
-        'class', 'class-event', 'THEME-ios-bar-button'
-      ])).toEqual([
-        'class', 'class-event', 'THEME-ios-bar-button'
-      ]);
-      expect(getClassList([
-        'class   ', '   class-event', '  THEME-ios-bar-button  '
-      ])).toEqual([
-        'class', 'class-event', 'THEME-ios-bar-button'
-      ]);
+    expect(getClassMap([
+      'class   ', '   class-event', '  THEME-ios-bar-button  '
+    ])).toEqual({
+      'class': true, 'class-event': true, 'THEME-ios-bar-button': true
+    });
 
-      expect(getClassList([
-        'class   ', null, undefined, '', '   class-event', '  THEME-ios-bar-button  '
-      ] as any)).toEqual([
-        'class', 'class-event', 'THEME-ios-bar-button'
-      ]);
+    expect(getClassMap([
+      'class   ', null, undefined, '', '   class-event', '  ', '  THEME-ios-bar-button  '
+    ] as any)).toEqual({
+      'class': true, 'class-event': true, 'THEME-ios-bar-button': true
     });
   });
 });
diff --git a/core/src/utils/theme.ts b/core/src/utils/theme.ts
index 52afad3f2c..6cbb3d1c65 100644
--- a/core/src/utils/theme.ts
+++ b/core/src/utils/theme.ts
@@ -3,10 +3,9 @@ import { CssClassMap, Mode } from '../interface';
 /**
  * Create the mode and color classes for the component based on the classes passed in
  */
-export function createThemedClasses(mode: Mode, color: string, classes: string): CssClassMap {
+export function createThemedClasses(mode: Mode | undefined, color: string | undefined, classes: string): CssClassMap {
   const classObj: CssClassMap = {};
-
-  classes.split(' ').forEach(classString => {
+  getClassList(classes).forEach(classString => {
     classObj[classString] = true;
 
     if (mode) {
@@ -17,8 +16,6 @@ export function createThemedClasses(mode: Mode, color: string, classes: string):
         classObj[`${classString}-${mode}-${color}`] = true;
       }
     }
-
-    return classObj;
   });
   return classObj;
 }
@@ -40,7 +37,7 @@ export function getElementClassMap(classList: DOMTokenList | string[]): CssClass
  * Get the classes based on the button type
  * e.g. alert-button, action-sheet-button
  */
-export function getButtonClassMap(buttonType: string, mode: Mode): CssClassMap {
+export function getButtonClassMap(buttonType: string | undefined, mode: Mode): CssClassMap {
   if (!buttonType) {
     return {};
   }