diff --git a/CrossPlatformModules.csproj b/CrossPlatformModules.csproj
index 5378cc00e..3daeec9e5 100644
--- a/CrossPlatformModules.csproj
+++ b/CrossPlatformModules.csproj
@@ -212,6 +212,10 @@
       <DependentUpon>xmlbasics.xml</DependentUpon>
     </TypeScriptCompile>
     <TypeScriptCompile Include="apps\ui-tests-app\bindings\basics.ts" />
+    <TypeScriptCompile Include="apps\ui-tests-app\custom-components\mymodulewithxml\MyControl.ts">
+      <DependentUpon>MyControl.xml</DependentUpon>
+    </TypeScriptCompile>
+    <TypeScriptCompile Include="apps\ui-tests-app\custom-components\mymodule\MyControl.ts" />
     <TypeScriptCompile Include="apps\ui-tests-app\layouts\absolute.ts" />
     <TypeScriptCompile Include="apps\ui-tests-app\layouts\dock.ts" />
     <TypeScriptCompile Include="apps\ui-tests-app\layouts\grid.ts" />
@@ -709,6 +713,12 @@
     <Content Include="apps\tests\xml-declaration\mymodulewithxml\MyControl.css" />
     <Content Include="apps\tests\xml-declaration\mymodule\MyControl.css" />
     <Content Include="apps\ui-tests-app\bindings\xmlbasics.xml" />
+    <Content Include="apps\ui-tests-app\custom-components\mymodulewithxml\MyControl.css" />
+    <Content Include="apps\ui-tests-app\custom-components\mymodulewithxml\MyControl.xml">
+      <SubType>Designer</SubType>
+    </Content>
+    <Content Include="apps\ui-tests-app\custom-components\mymodule\MyControl.css" />
+    <Content Include="apps\ui-tests-app\custom-components\page.xml" />
     <Content Include="apps\ui-tests-app\layouts\absolute.xml" />
     <Content Include="apps\ui-tests-app\layouts\dock.xml" />
     <Content Include="apps\ui-tests-app\layouts\grid.xml" />
@@ -1591,6 +1601,12 @@
     <Content Include="apps\cuteness.unoptimized\package.json">
       <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
     </Content>
+    <Content Include="apps\ui-tests-app\custom-components\mymodule\package.json">
+      <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
+    </Content>
+    <Content Include="apps\ui-tests-app\custom-components\mymodulewithxml\package.json">
+      <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
+    </Content>
     <None Include="js-libs\esprima\LICENSE.BSD" />
     <Content Include="source-control.md" />
     <Content Include="ui\segmented-bar\package.json">
diff --git a/apps/ui-tests-app/custom-components/mymodule/MyControl.css b/apps/ui-tests-app/custom-components/mymodule/MyControl.css
new file mode 100644
index 000000000..d701672c7
--- /dev/null
+++ b/apps/ui-tests-app/custom-components/mymodule/MyControl.css
@@ -0,0 +1,3 @@
+.MyStackLayout {
+    background-color: red;
+}
diff --git a/apps/ui-tests-app/custom-components/mymodule/MyControl.ts b/apps/ui-tests-app/custom-components/mymodule/MyControl.ts
new file mode 100644
index 000000000..aca0396d3
--- /dev/null
+++ b/apps/ui-tests-app/custom-components/mymodule/MyControl.ts
@@ -0,0 +1,24 @@
+import observable = require("data/observable");
+import stackLayoutModule = require("ui/layouts/stack-layout");
+import label = require("ui/label");
+import button = require("ui/button");
+
+export class MyControl extends stackLayoutModule.StackLayout {
+    constructor() {
+        super();
+
+        var counter: number = 0;
+
+        var lbl = new label.Label();
+        var btn = new button.Button();
+        btn.text = "Tap me!";
+        btn.on(button.Button.tapEvent, (args: observable.EventData) => {
+            lbl.text = "Tap " + counter++;
+        });
+
+        this.addChild(lbl);
+        this.addChild(btn);
+
+        this.cssClass = "MyStackLayout";
+    }
+}
\ No newline at end of file
diff --git a/apps/ui-tests-app/custom-components/mymodule/package.json b/apps/ui-tests-app/custom-components/mymodule/package.json
new file mode 100644
index 000000000..55267b5f2
--- /dev/null
+++ b/apps/ui-tests-app/custom-components/mymodule/package.json
@@ -0,0 +1,2 @@
+{ "name" : "MyControl",
+  "main" : "MyControl.js" }
\ No newline at end of file
diff --git a/apps/ui-tests-app/custom-components/mymodulewithxml/MyControl.css b/apps/ui-tests-app/custom-components/mymodulewithxml/MyControl.css
new file mode 100644
index 000000000..dd3ccf653
--- /dev/null
+++ b/apps/ui-tests-app/custom-components/mymodulewithxml/MyControl.css
@@ -0,0 +1,3 @@
+.MySecondCustomStackLayout {
+    background-color: green;
+}
diff --git a/apps/ui-tests-app/custom-components/mymodulewithxml/MyControl.ts b/apps/ui-tests-app/custom-components/mymodulewithxml/MyControl.ts
new file mode 100644
index 000000000..532f0f6c5
--- /dev/null
+++ b/apps/ui-tests-app/custom-components/mymodulewithxml/MyControl.ts
@@ -0,0 +1,16 @@
+import observable = require("data/observable");
+import view = require("ui/core/view");
+import label = require("ui/label");
+
+var count = 0;
+export function buttonTap2(args: observable.EventData) {
+    count++;
+
+    var parent = (<view.View>args.object).parent;
+    if (parent) {
+        var lbl = parent.getViewById<label.Label>("Label1");
+        if (lbl) {
+            lbl.text = "You clicked " + count + " times!";
+        }
+    }
+}
\ No newline at end of file
diff --git a/apps/ui-tests-app/custom-components/mymodulewithxml/MyControl.xml b/apps/ui-tests-app/custom-components/mymodulewithxml/MyControl.xml
new file mode 100644
index 000000000..4fe8e30f7
--- /dev/null
+++ b/apps/ui-tests-app/custom-components/mymodulewithxml/MyControl.xml
@@ -0,0 +1,4 @@
+<StackLayout xmlns:customControls="xml-declaration/mymodule" cssClass="MySecondCustomStackLayout">
+  <Label id="Label1" text="mymodulewithxml" />
+  <Button text="Click!" tap="buttonTap2" /> 
+</StackLayout>
diff --git a/apps/ui-tests-app/custom-components/mymodulewithxml/package.json b/apps/ui-tests-app/custom-components/mymodulewithxml/package.json
new file mode 100644
index 000000000..55267b5f2
--- /dev/null
+++ b/apps/ui-tests-app/custom-components/mymodulewithxml/package.json
@@ -0,0 +1,2 @@
+{ "name" : "MyControl",
+  "main" : "MyControl.js" }
\ No newline at end of file
diff --git a/apps/ui-tests-app/custom-components/page.xml b/apps/ui-tests-app/custom-components/page.xml
new file mode 100644
index 000000000..26559db84
--- /dev/null
+++ b/apps/ui-tests-app/custom-components/page.xml
@@ -0,0 +1,7 @@
+<Page xmlns:customControls="custom-components/mymodule"
+      xmlns:customControls2="custom-components/mymodulewithxml">
+  <StackLayout>
+    <customControls:MyControl />
+    <customControls2:MyControl />
+  </StackLayout>
+</Page>
\ No newline at end of file
diff --git a/apps/ui-tests-app/mainPage.ts b/apps/ui-tests-app/mainPage.ts
index 4b05362b8..b0101b462 100644
--- a/apps/ui-tests-app/mainPage.ts
+++ b/apps/ui-tests-app/mainPage.ts
@@ -10,7 +10,7 @@ import trace = require("trace");
 trace.enable();
 trace.setCategories(trace.categories.Test);
 
-var list: string[] = ["pages", "layouts", "modal-view", "bindings"];
+var list: string[] = ["pages", "layouts", "modal-view", "bindings", "custom-components"];
 
 // basePath is auto-changed when building multiple apps
 var basePath = "";