device-orientation-permisson-ui: Don't emit "granted" event until permissions are actually granted. (#5079)

* Change order of catch and then branches

* Clarify comments

Author: diarmidmackenzie

src/components/scene/device-orientation-permission-ui.js

@@ -52,17 +52,17 @@ module.exports.Component = registerComponent('device-orientation-permission-ui',
     this.onDeviceMotionDialogAllowClicked = bind(this.onDeviceMotionDialogAllowClicked, this);
     this.onDeviceMotionDialogDenyClicked = bind(this.onDeviceMotionDialogDenyClicked, this);
     // Show dialog only if permission has not yet been granted.
-    DeviceOrientationEvent.requestPermission().catch(function () {
+    DeviceOrientationEvent.requestPermission().then(function () {
+      self.el.emit('deviceorientationpermissiongranted');
+      self.permissionGranted = true;
+    }).catch(function () {
       self.devicePermissionDialogEl = createPermissionDialog(
         self.data.denyButtonText,
         self.data.allowButtonText,
         self.data.deviceMotionMessage,
         self.onDeviceMotionDialogAllowClicked,
         self.onDeviceMotionDialogDenyClicked);
       self.el.appendChild(self.devicePermissionDialogEl);
-    }).then(function () {
-      self.el.emit('deviceorientationpermissiongranted');
-      self.permissionGranted = true;
     });
   },
 

tests/components/scene/device-motion-permission-ui.test.js

@@ -11,7 +11,15 @@ suite('device-orientation-permission-ui', function () {
       window.DeviceOrientationEvent = {
         requestPermission: function () { return Promise.reject(); }
       };
-      el.addEventListener('loaded', function () { done(); });
+      el.addEventListener('deviceorientationpermissiongranted', function () {
+        assert.fail('Received permissiongranted too soon.');
+      });
+      el.addEventListener('deviceorientationpermissionrejected', function () {
+        assert.fail('Received permissionrejected too soon.');
+      });
+      el.addEventListener('loaded', function () {
+        done();
+      });
     });
 
     test('appends permission dialog', function (done) {