Create an accessible element for the dialog box

Change-Id: Idced1409b7f069f044833e96ea5c31fab0807c63
Reviewed-by: Morten Johan Sørvig <[email protected]>

1 files changed, 28 insertions, 24 deletions

diff --git a/tests/manual/wasm/a11y/qml_basic_item/AboutDialog.qml b/tests/manual/wasm/a11y/qml_basic_item/AboutDialog.qml
index d9e8e4661a..272ab832a9 100644
--- a/tests/manual/wasm/a11y/qml_basic_item/AboutDialog.qml
+++ b/tests/manual/wasm/a11y/qml_basic_item/AboutDialog.qml
@@ -10,36 +10,40 @@ Dialog {
     height: 150
     title: "WebAssembly Dialog box"
     modal: true
-    Rectangle {
+
+    background: Rectangle {
         width: parent.width * 0.8
         height: parent.height * 0.4
         color: "lightgray"
         anchors.fill: parent
-        ColumnLayout {
-            spacing: 2
-            anchors.fill: parent
+        Accessible.role: Accessible.Dialog
+        Accessible.name: parent.title
+        Accessible.description: "The About Dialog box."
+    }
+    ColumnLayout {
+        spacing: 2
+        anchors.fill: parent
 
-            Label {
-                id: labelInfo
-                Layout.alignment: Qt.AlignCenter
-                text: "Accessibility Demo sample application developed in QML."
-                Accessible.role: Accessible.StaticText
-                horizontalAlignment: Text.AlignHCenter
-                Accessible.name: text
-                Accessible.description: "Purpose of this application."
-                wrapMode: Text.WordWrap
-            }
+        Label {
+            id: labelInfo
+            Layout.alignment: Qt.AlignCenter
+            text: "Accessibility Demo sample application developed in QML."
+            Accessible.role: Accessible.StaticText
+            horizontalAlignment: Text.AlignHCenter
+            Accessible.name: text
+            Accessible.description: "Purpose of this application."
+            wrapMode: Text.WordWrap
+        }
 
-            Button {
-                id: closeButton
-                text: "Close"
-                Layout.alignment: Qt.AlignCenter
-                Accessible.role: Accessible.Button
-                Accessible.name: text
-                Accessible.description: "To close the About Dialog box."
-                onClicked: {
-                    aboutDialog.close()
-                }
+        Button {
+            id: closeButton
+            text: "Close"
+            Layout.alignment: Qt.AlignCenter
+            Accessible.role: Accessible.Button
+            Accessible.name: text
+            Accessible.description: "To close the About Dialog box."
+            onClicked: {
+                aboutDialog.close()
             }
         }
     }