diff --git a/src/components/modal/modal.ts b/src/components/modal/modal.ts
index 7670152b27..9b5bd98f4a 100644
--- a/src/components/modal/modal.ts
+++ b/src/components/modal/modal.ts
@@ -194,7 +194,9 @@ export class ModalCmp {
     this._compiler.resolveComponent(componentType).then((componentFactory) => {
       let componentRef = this.viewport.createComponent(componentFactory, this.viewport.length, this.viewport.parentInjector);
       this._renderer.setElementClass(componentRef.location.nativeElement, 'show-page', true);
-      this._renderer.setElementClass(componentRef.location.nativeElement, componentType.name, true);
+      // auto-add page css className created from component JS class name
+      let cssClassName = pascalCaseToDashCase(componentType.name);
+      this._renderer.setElementClass(componentRef.location.nativeElement, cssClassName, true);
       this._viewCtrl.setInstance(componentRef.instance);
       this.enabled = true;
       done();
diff --git a/src/components/modal/test/basic/index.ts b/src/components/modal/test/basic/index.ts
index b126e7d30e..1c98e0f925 100644
--- a/src/components/modal/test/basic/index.ts
+++ b/src/components/modal/test/basic/index.ts
@@ -1,6 +1,6 @@
-import {Component} from '@angular/core';
-import {ionicBootstrap, Config, Platform} from '../../../../../src';
-import {Modal, ActionSheet, NavController, NavParams, PageTransition, TransitionOptions, ViewController} from '../../../../../src';
+import { Component } from '@angular/core';
+
+import { ActionSheet, Config, ionicBootstrap, Modal, NavController, NavParams, PageTransition, Platform, TransitionOptions, ViewController } from '../../../../../src';
 
 @Component({
   templateUrl: 'main.html'
@@ -25,7 +25,7 @@ class E2EPage {
     console.log('android', platform.is('android'));
     console.log('windows phone', platform.is('windows'));
 
-    platform.ready().then((readySource) => {
+    platform.ready().then((readySource: string) => {
       console.log('platform.ready, readySource:', readySource);
     });
 
@@ -73,7 +73,6 @@ class E2EPage {
   presentNavigableModal(){
     let modal = Modal.create(NavigableModal);
     this.nav.present(modal);
-    //this.nav.push(NavigableModal);
   }
 }
 
@@ -90,8 +89,8 @@ class E2EPage {
   </ion-content>
   `
 })
-class NavigableModal{
-  constructor(private navController:NavController){
+class NavigableModal {
+  constructor(private navController:NavController) {
   }
 
   submit(){
@@ -112,8 +111,8 @@ class NavigableModal{
   </ion-content>
   `
 })
-class NavigableModal2{
-  constructor(private navController:NavController){
+class NavigableModal2 {
+  constructor(private navController:NavController) {
   }
 
   submit(){