diff --git a/tests/components/ComponentBase.qml b/tests/components/ComponentBase.qml
new file mode 100644
index 000000000..e3245fb4c
--- /dev/null
+++ b/tests/components/ComponentBase.qml
@@ -0,0 +1,37 @@
+import QtQuick 2.0
+import QtQuick.Layouts 1.2
+
+import org.kde.plasma.core 2.0 as PlasmaCore
+import org.kde.plasma.components 3.0 as PlasmaComponents
+
+PlasmaCore.ColorScope
+{
+    id: root
+    width: 500
+    height: 300
+    property bool invertedColors: false
+    default property alias children: container.children
+    colorGroup: invertedColors ? PlasmaCore.Theme.ComplementaryColorGroup : PlasmaCore.Theme.NormalColorGroup
+
+    Rectangle {
+        anchors.fill: parent
+        color:  PlasmaCore.ColorScope.backgroundColor
+    }
+ 
+    PlasmaComponents.Label {
+        id: label
+        text: root.invertedColors ? "Invert" : "Normal"
+        MouseArea {
+            anchors.fill: parent
+            onClicked: root.invertedColors = !root.invertedColors
+        }
+    } 
+    
+    Item {
+        id: container
+        anchors.top: label.bottom
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.bottom: parent.bottom
+    }
+}
diff --git a/tests/components/busyindicator.qml b/tests/components/busyindicator.qml
index 7a38418b3..0279ee0d3 100644
--- a/tests/components/busyindicator.qml
+++ b/tests/components/busyindicator.qml
@@ -1,11 +1,7 @@
 import QtQuick 2.0
 import org.kde.plasma.components 2.0 as PlasmaComponents
 
-Rectangle {
-    width: 600
-    height: 300
-    color: "white"
-
+ComponentBase {
     Column {
         anchors.fill: parent
         anchors.margins: 20
@@ -33,5 +29,4 @@ Rectangle {
         }
 
     }
-
 }
diff --git a/tests/components/busyindicator3.qml b/tests/components/busyindicator3.qml
index 2fd3055c5..1eeb24680 100644
--- a/tests/components/busyindicator3.qml
+++ b/tests/components/busyindicator3.qml
@@ -1,11 +1,7 @@
 import QtQuick 2.0
 import org.kde.plasma.components 3.0 as PlasmaComponents
 
-Rectangle {
-    width: 600
-    height: 300
-    color: "white"
-
+ComponentBase {
     Column {
         anchors.fill: parent
         anchors.margins: 20
diff --git a/tests/components/button.qml b/tests/components/button.qml
index 3382f099c..c309b5752 100644
--- a/tests/components/button.qml
+++ b/tests/components/button.qml
@@ -4,12 +4,7 @@ import org.kde.plasma.components 2.0 as PlasmaComponents
 import QtQuick.Controls 1.2
 import QtQuick.Layouts 1.2
 
-Rectangle
-{
-    width: 500
-    height: 500
-    color: "white"
-
+ComponentBase {
     Grid {
         anchors.fill: parent
         anchors.margins: 20
diff --git a/tests/components/button3.qml b/tests/components/button3.qml
index 81e41b974..57a2255b6 100644
--- a/tests/components/button3.qml
+++ b/tests/components/button3.qml
@@ -3,19 +3,14 @@ import QtQuick 2.0
 import org.kde.plasma.components 3.0 as PlasmaComponents
 import QtQuick.Layouts 1.2
 
-Rectangle
-{
-    width: 500
-    height: 500
-    color: "white"
-
+ComponentBase {
     Grid {
         anchors.fill: parent
         anchors.margins: 20
         spacing: 20
         columns: 2
 
-        Label {
+        PlasmaComponents.Label {
             text: "icon + text"
         }
 
@@ -24,7 +19,7 @@ Rectangle
             text: "test"
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "icon alone, should look small and square"
         }
 
@@ -32,7 +27,7 @@ Rectangle
             icon.name: "list-remove"
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "text alone, should be about 12 chars wide"
         }
 
@@ -41,7 +36,7 @@ Rectangle
         }
 
 
-        Label {
+        PlasmaComponents.Label {
             text: "long text, should expand to fit"
         }
 
@@ -50,7 +45,7 @@ Rectangle
             text: "This is a really really really really long button"
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "long text but constrained, should be 150px and elided"
         }
 
@@ -61,7 +56,7 @@ Rectangle
         }
 
 
-        Label {
+        PlasmaComponents.Label {
             text: "button (with or without icon) and textfield should have the same height"
         }
 
@@ -77,7 +72,7 @@ Rectangle
             }
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "minimum width property. Should be two letters wide"
         }
 
diff --git a/tests/components/checkbox.qml b/tests/components/checkbox.qml
index 4432e8a04..4ae8f22bd 100644
--- a/tests/components/checkbox.qml
+++ b/tests/components/checkbox.qml
@@ -4,12 +4,7 @@ import org.kde.plasma.components 2.0 as PlasmaComponents
 import QtQuick.Controls 1.2
 import QtQuick.Layouts 1.2
 
-Rectangle
-{
-    width: 500
-    height: 500
-    color: "white"
-
+ComponentBase {
     Grid {
         anchors.fill: parent
         anchors.margins: 20
diff --git a/tests/components/checkbox3.qml b/tests/components/checkbox3.qml
index 1f0642afa..e71c438cc 100644
--- a/tests/components/checkbox3.qml
+++ b/tests/components/checkbox3.qml
@@ -3,26 +3,21 @@ import QtQuick 2.0
 import org.kde.plasma.components 3.0 as PlasmaComponents
 import QtQuick.Layouts 1.2
 
-Rectangle
-{
-    width: 500
-    height: 500
-    color: "white"
-
+ComponentBase {
     Grid {
         anchors.fill: parent
         anchors.margins: 20
         spacing: 4
         columns: 2
 
-        Label {
+        PlasmaComponents.Label {
             text: "text"
         }
         PlasmaComponents.CheckBox {
             text: "Some awesome checkbox"
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "focus"
         }
         PlasmaComponents.CheckBox {
@@ -30,7 +25,7 @@ Rectangle
             focus: true
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "checked"
         }
         PlasmaComponents.CheckBox {
@@ -38,7 +33,7 @@ Rectangle
             checkState: Qt.Checked
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "tri-state"
         }
         PlasmaComponents.CheckBox {
@@ -46,7 +41,7 @@ Rectangle
             checkState: Qt.PartiallyChecked
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "disabled"
         }
         PlasmaComponents.CheckBox {
@@ -54,7 +49,7 @@ Rectangle
             enabled: false
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "disabled and checked"
         }
         PlasmaComponents.CheckBox {
diff --git a/tests/components/combobox.qml b/tests/components/combobox.qml
index dcc7336c0..6e8083328 100644
--- a/tests/components/combobox.qml
+++ b/tests/components/combobox.qml
@@ -3,23 +3,17 @@ import QtQuick 2.0
 import org.kde.plasma.components 2.0
 import org.kde.plasma.core 2.0 as PlasmaCore
 
-Rectangle {
-    id: root
-    color: "white"
-    width: 800
-    height: 300
-
-    ListModel {
-        id: demoModel
-        ListElement { text: "Banana"; color: "Yellow" }
-        ListElement { text: "Apple"; color: "Green" }
-        ListElement { text: "Coconut"; color: "Brown" }
-    }
-
+ComponentBase {
     Flow {
         anchors.fill: parent
         anchors.margins: 20
         spacing: 20
+        ListModel {
+            id: demoModel
+            ListElement { text: "Banana"; color: "Yellow" }
+            ListElement { text: "Apple"; color: "Green" }
+            ListElement { text: "Coconut"; color: "Brown" }
+        }
 
         ComboBox {
             model:demoModel
diff --git a/tests/components/menu.qml b/tests/components/menu.qml
index 3d72a6fe3..603eb83cb 100644
--- a/tests/components/menu.qml
+++ b/tests/components/menu.qml
@@ -1,10 +1,7 @@
 import QtQuick 2.0
 import org.kde.plasma.components 2.0 as PlasmaComponents
 
-Rectangle {
-    width: 600
-    height: 250
-    color: "white"
+ComponentBase {
 
     Flow {
         anchors.fill: parent
diff --git a/tests/components/progressbar.qml b/tests/components/progressbar.qml
index b66274f79..ea40cafb0 100644
--- a/tests/components/progressbar.qml
+++ b/tests/components/progressbar.qml
@@ -2,15 +2,10 @@ import QtQuick 2.0
 
 import org.kde.plasma.components 2.0 as PlasmaComponents
 
-Rectangle {
+ComponentBase {
     id: root
-
     property int orientation: orientationCombo.model[orientationCombo.currentIndex].value
 
-    color: "white"
-    width: 900
-    height: 600
-
     Flow {
         anchors.fill: parent
         anchors.margins: 20
diff --git a/tests/components/progressbar3.qml b/tests/components/progressbar3.qml
index fae53f3e8..033896b4f 100644
--- a/tests/components/progressbar3.qml
+++ b/tests/components/progressbar3.qml
@@ -2,13 +2,9 @@ import QtQuick 2.0
 
 import org.kde.plasma.components 3.0 as PlasmaComponents
 
-Rectangle {
+ComponentBase {
     id: root
 
-    color: "white"
-    width: 900
-    height: 600
-
     Flow {
         anchors.fill: parent
         anchors.margins: 20
diff --git a/tests/components/radiobutton.qml b/tests/components/radiobutton.qml
index 4bab9e4cd..273436492 100644
--- a/tests/components/radiobutton.qml
+++ b/tests/components/radiobutton.qml
@@ -4,26 +4,21 @@ import org.kde.plasma.components 2.0 as PlasmaComponents
 import QtQuick.Controls 1.2
 import QtQuick.Layouts 1.2
 
-Rectangle
-{
-    width: 500
-    height: 500
-    color: "white"
-
+ComponentBase {
     Grid {
         anchors.fill: parent
         anchors.margins: 20
         spacing: 4
         columns: 2
 
-        Label {
+        PlasmaComponents.Label {
             text: "text"
         }
         PlasmaComponents.RadioButton {
             text: "Some awesome radiobutton"
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "focus"
         }
         PlasmaComponents.RadioButton {
@@ -31,7 +26,7 @@ Rectangle
             focus: true
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "checked"
         }
         PlasmaComponents.RadioButton {
@@ -39,7 +34,7 @@ Rectangle
             checked: true
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "disabled"
         }
         PlasmaComponents.RadioButton {
@@ -47,7 +42,7 @@ Rectangle
             enabled: false
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "disabled and checked"
         }
         PlasmaComponents.RadioButton {
diff --git a/tests/components/radiobutton3.qml b/tests/components/radiobutton3.qml
index cfc6fb4c5..28693b64a 100644
--- a/tests/components/radiobutton3.qml
+++ b/tests/components/radiobutton3.qml
@@ -3,26 +3,21 @@ import QtQuick 2.0
 import org.kde.plasma.components 2.0 as PlasmaComponents
 import QtQuick.Layouts 1.2
 
-Rectangle
-{
-    width: 500
-    height: 500
-    color: "white"
-
+ComponentBase {
     Grid {
         anchors.fill: parent
         anchors.margins: 20
         spacing: 4
         columns: 2
 
-        Label {
+        PlasmaComponents.Label {
             text: "text"
         }
         PlasmaComponents.RadioButton {
             text: "Some awesome radiobutton"
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "focus"
         }
         PlasmaComponents.RadioButton {
@@ -30,7 +25,7 @@ Rectangle
             focus: true
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "checked"
         }
         PlasmaComponents.RadioButton {
@@ -38,7 +33,7 @@ Rectangle
             checked: true
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "disabled"
         }
         PlasmaComponents.RadioButton {
@@ -46,7 +41,7 @@ Rectangle
             enabled: false
         }
 
-        Label {
+        PlasmaComponents.Label {
             text: "disabled and checked"
         }
         PlasmaComponents.RadioButton {
diff --git a/tests/components/textarea.qml b/tests/components/textarea.qml
index b16bc7931..9968b1518 100644
--- a/tests/components/textarea.qml
+++ b/tests/components/textarea.qml
@@ -4,11 +4,8 @@ import org.kde.plasma.components 2.0 as PlasmaComponents
 
 import QtQuick.Controls 1.3
 
-Rectangle {
+ComponentBase {
     id: root
-    color: "white"
-    width: 800
-    height: 300
 
     property string longText: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed at volutpat nibh, non elementum nulla. Nunc sem magna, semper sit amet sollicitudin et, vestibulum sed metus. Fusce tempor dolor purus, non posuere urna sodales in. Aenean eu erat ipsum. Fusce egestas pulvinar nisi. Mauris vel enim tincidunt, elementum diam sed, tincidunt nulla. Maecenas tempus vitae ligula et convallis. Nullam justo velit, dignissim a nisl at, blandit posuere leo. Maecenas ac scelerisque odio, eget placerat ipsum. Ut iaculis, tortor et ullamcorper fringilla, mauris neque dapibus arcu, eget suscipit libero libero ut nunc. Sed maximus enim a ligula facilisis, non efficitur dolor blandit. Curabitur venenatis mattis erat ac gravida."
 
diff --git a/tests/components/textarea3.qml b/tests/components/textarea3.qml
index 3ff69b131..d91f9c992 100644
--- a/tests/components/textarea3.qml
+++ b/tests/components/textarea3.qml
@@ -2,11 +2,8 @@ import QtQuick 2.0
 
 import org.kde.plasma.components 3.0 as PlasmaComponents
 
-Rectangle {
+ComponentBase {
     id: root
-    color: "white"
-    width: 800
-    height: 300
 
     property string longText: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed at volutpat nibh, non elementum nulla. Nunc sem magna, semper sit amet sollicitudin et, vestibulum sed metus. Fusce tempor dolor purus, non posuere urna sodales in. Aenean eu erat ipsum. Fusce egestas pulvinar nisi. Mauris vel enim tincidunt, elementum diam sed, tincidunt nulla. Maecenas tempus vitae ligula et convallis. Nullam justo velit, dignissim a nisl at, blandit posuere leo. Maecenas ac scelerisque odio, eget placerat ipsum. Ut iaculis, tortor et ullamcorper fringilla, mauris neque dapibus arcu, eget suscipit libero libero ut nunc. Sed maximus enim a ligula facilisis, non efficitur dolor blandit. Curabitur venenatis mattis erat ac gravida."
 
diff --git a/tests/components/textfield.qml b/tests/components/textfield.qml
index a22ac29e3..bc4a885f7 100644
--- a/tests/components/textfield.qml
+++ b/tests/components/textfield.qml
@@ -4,12 +4,8 @@ import org.kde.plasma.components 2.0 as PlasmaComponents
 
 import QtQuick.Controls 1.3
 
-Rectangle {
+ComponentBase {
     id: root
-    color: "white"
-    width: 800
-    height: 300
-
     property string longText: "This is a longer sentence"
 
     Flow {
diff --git a/tests/components/textfield3.qml b/tests/components/textfield3.qml
index db6d24c6b..2a04eaa56 100644
--- a/tests/components/textfield3.qml
+++ b/tests/components/textfield3.qml
@@ -2,12 +2,8 @@ import QtQuick 2.0
 
 import org.kde.plasma.components 3.0 as PlasmaComponents
 
-Rectangle {
+ComponentBase {
     id: root
-    color: "white"
-    width: 800
-    height: 300
-
     property string longText: "This is a longer sentence"
 
     Flow {
diff --git a/tests/components/toolbutton.qml b/tests/components/toolbutton.qml
index 1f9b0e17d..027cc78de 100644
--- a/tests/components/toolbutton.qml
+++ b/tests/components/toolbutton.qml
@@ -2,12 +2,7 @@ import QtQuick 2.0
 
 import org.kde.plasma.components 2.0 as PlasmaComponents
 
-Rectangle
-{
-    width: 500
-    height: 300
-    color: "white"
-
+ComponentBase {
     Flow {
         anchors.fill: parent
         anchors.margins: 20
diff --git a/tests/components/toolbutton3.qml b/tests/components/toolbutton3.qml
index 678585c26..139b15bc1 100644
--- a/tests/components/toolbutton3.qml
+++ b/tests/components/toolbutton3.qml
@@ -1,13 +1,10 @@
 import QtQuick 2.0
 
+import org.kde.plasma.core 2.0 as PlasmaCore
+
 import org.kde.plasma.components 3.0 as PlasmaComponents
 
-Rectangle
-{
-    width: 500
-    height: 300
-    color: "white"
-
+ComponentBase {
     Flow {
         anchors.fill: parent
         anchors.margins: 20