Fix handling of LDAP groups that contain dots

Polymer's property path system has no way to handle dots in property
names, so using this.set() will result in splitting up the group name
into multiple path parts.

Tweaked the tests to expose this problem and added ample comments to the
code.

Bug: Issue 11980
Change-Id: I96d6dfa50908ddafb4d0fa12d247d33444c36b4e
diff --git a/polygerrit-ui/app/elements/admin/gr-permission/gr-permission.js b/polygerrit-ui/app/elements/admin/gr-permission/gr-permission.js
index 633a1db..e33c1ec 100644
--- a/polygerrit-ui/app/elements/admin/gr-permission/gr-permission.js
+++ b/polygerrit-ui/app/elements/admin/gr-permission/gr-permission.js
@@ -252,7 +252,12 @@
       // The group id is encoded, but have to decode in order for the access
       // API to work as expected.
       const groupId = decodeURIComponent(e.detail.value.id).replace(/\+/g, ' ');
-      this.set(['permission', 'value', 'rules', groupId], {});
+      // We cannot use "this.set(...)" here, because groupId may contain dots,
+      // and dots in property path names are totally unsupported by Polymer.
+      // Apparently Polymer picks up this change anyway, otherwise we should
+      // have looked at using MutableData:
+      // https://polymer-library.polymer-project.org/2.0/docs/devguide/data-system#mutable-data
+      this.permission.value.rules[groupId] = {};
 
       // Purposely don't recompute sorted array so that the newly added rule
       // is the last item of the array.
@@ -273,7 +278,8 @@
       Polymer.dom.flush();
       const value = this._rules[this._rules.length - 1].value;
       value.added = true;
-      this.set(['permission', 'value', 'rules', groupId], value);
+      // See comment above for why we cannot use "this.set(...)" here.
+      this.permission.value.rules[groupId] = value;
       this.dispatchEvent(new CustomEvent('access-modified', {bubbles: true}));
     },
 
diff --git a/polygerrit-ui/app/elements/admin/gr-permission/gr-permission_test.html b/polygerrit-ui/app/elements/admin/gr-permission/gr-permission_test.html
index 5f1f9b5..a432ab0 100644
--- a/polygerrit-ui/app/elements/admin/gr-permission/gr-permission_test.html
+++ b/polygerrit-ui/app/elements/admin/gr-permission/gr-permission_test.html
@@ -310,11 +310,11 @@
         element.name = 'Priority';
         element.section = 'refs/*';
         element.groups = {};
-        element.$.groupAutocomplete.text = 'ldap/tests tests';
+        element.$.groupAutocomplete.text = 'ldap/tests te.st';
         const e = {
           detail: {
             value: {
-              id: 'ldap:CN=test+test',
+              id: 'ldap:CN=test+te.st',
             },
           },
         };
@@ -323,11 +323,11 @@
         assert.equal(Object.keys(element._groupsWithRules).length, 2);
         element._handleAddRuleItem(e);
         flushAsynchronousOperations();
-        assert.deepEqual(element.groups, {'ldap:CN=test test': {
-          name: 'ldap/tests tests'}});
+        assert.deepEqual(element.groups, {'ldap:CN=test te.st': {
+          name: 'ldap/tests te.st'}});
         assert.equal(element._rules.length, 3);
         assert.equal(Object.keys(element._groupsWithRules).length, 3);
-        assert.deepEqual(element.permission.value.rules['ldap:CN=test test'],
+        assert.deepEqual(element.permission.value.rules['ldap:CN=test te.st'],
             {action: 'ALLOW', min: -2, max: 2, added: true});
         // New rule should be removed if cancel from editing.
         element.editing = false;