fix acl policy with two hosts should not allow empty as host

ui/src/__tests__/components/microsegmentation/__snapshots__/AddSegmentation.test.js.snap

@@ -680,6 +680,7 @@ exports[`AddSegmentation should render fail to submit add-segmentation: destinat
         <input
           autocomplete="off"
           data-testid="input-node"
+          data-wdio="identifier"
           placeholder="Enter a unique identifier for this ACL policy"
           value=""
         />
@@ -885,6 +886,7 @@ exports[`AddSegmentation should render fail to submit add-segmentation: destinat
           <input
             autocomplete="off"
             data-testid="input-node"
+            data-wdio="instances0"
             name="instances0"
             placeholder="Comma separated list, Leave blank to apply to all hosts"
             value=""
@@ -900,7 +902,7 @@ exports[`AddSegmentation should render fail to submit add-segmentation: destinat
           <svg
             class="emotion-69"
             data-testid="icon"
-            data-wdio=""
+            data-wdio="add-circle"
             height="1.75em"
             id=""
             viewBox="0 0 1024 1024"
@@ -937,6 +939,7 @@ exports[`AddSegmentation should render fail to submit add-segmentation: destinat
           <input
             autocomplete="off"
             data-testid="input-node"
+            data-wdio="destination-port"
             placeholder="eg: 4443"
             value=""
           />
@@ -962,6 +965,7 @@ exports[`AddSegmentation should render fail to submit add-segmentation: destinat
         <input
           autocomplete="off"
           data-testid="input-node"
+          data-wdio="source-service"
           placeholder="eg: yamas.api, sys.auth.zms"
           value=""
         />

ui/src/__tests__/components/service/__snapshots__/AddService.test.js.snap

@@ -279,6 +279,7 @@ exports[`AddService should render 1`] = `
         <input
           autocomplete="off"
           data-testid="input-node"
+          data-wdio="service-name"
           id="service-name"
           name="service-name"
           value=""

ui/src/__tests__/components/service/__snapshots__/AddServiceForm.test.js.snap

@@ -279,6 +279,7 @@ exports[`AddServiceForm should render 1`] = `
         <input
           autocomplete="off"
           data-testid="input-node"
+          data-wdio="service-name"
           id="service-name"
           name="service-name"
           value=""

ui/src/__tests__/spec/tests/microsegmentation.spec.js

@@ -0,0 +1,127 @@
+/*
+ * Copyright The Athenz Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const TEST_ENFORCE_AND_REPORT_WITH_TWO_HOSTS_STAR_OR_EMPTY_CANNOT_BE_USED_AS_HOST =
+    "in enforce and report mode with two hosts '*' or empty cannot be used as either host";
+const SERVICE_NAME_TWO_HOSTS = 'two-hosts-test-service';
+
+describe('Microsegmentation', () => {
+    let currentTest;
+
+    it(
+        TEST_ENFORCE_AND_REPORT_WITH_TWO_HOSTS_STAR_OR_EMPTY_CANNOT_BE_USED_AS_HOST,
+        async () => {
+            currentTest =
+                TEST_ENFORCE_AND_REPORT_WITH_TWO_HOSTS_STAR_OR_EMPTY_CANNOT_BE_USED_AS_HOST;
+            await browser.newUser();
+            await browser.url(`/domain/athenz.dev.functional-test/role`);
+            await expect(browser).toHaveUrl(expect.stringContaining('athenz'));
+
+            // add service before test
+            await $('div*=Services').click();
+            await $('button*=Add Service').click();
+            await $('input[data-wdio="service-name"]').addValue(
+                SERVICE_NAME_TWO_HOSTS
+            );
+            await $('button*=Submit').click();
+
+            // navigate to Microsegmentation tab
+            await $('div*=Microsegmentation').click();
+            // click add ACL policy
+            await $('button*=Add ACL Policy').click();
+            // add identifier
+            const policyName = 'noEmptyHostsInPolicyWithTwoHosts';
+            await $('input[data-wdio="identifier"]').addValue(policyName);
+
+            // select destination service - TODO will need cleanup
+            await $('input[name="destinationService"]').click();
+            let testServiceInDropdown = await $(
+                `//div[contains(text(), "${SERVICE_NAME_TWO_HOSTS}")]`
+            );
+            await testServiceInDropdown.click();
+
+            // add PES Host
+            let addPesHost = await $(
+                `.//*[local-name()="svg" and @data-wdio="add-circle"]`
+            );
+            await addPesHost.click();
+            // add first host
+            let instances0 = await $('input[data-wdio="instances0"]');
+            await instances0.addValue('test.test.tst1.yahoo.com');
+            // leave second hosts empty
+            let instances1 = await $('input[data-wdio="instances1"]');
+            await instances1.addValue('');
+
+            let destPort = await $('input[data-wdio="destination-port"]');
+            await destPort.addValue('4443');
+
+            let sourceService = await $('input[data-wdio="source-service"]');
+            await sourceService.addValue('yamas.api');
+
+            let protocolDropdown = await $('input[name="protocol"]');
+            await protocolDropdown.click();
+            let dropdownOption = await $('//div[contains(text(), "TCP")]');
+            await dropdownOption.click();
+
+            // attempt to submit
+            let submitButton = await $('button*=Submit');
+            await submitButton.click();
+
+            // verify error exists and matches
+            let errorMessage = await $('div[data-testid="error-message"]');
+            expect(await errorMessage.getText()).toBe(
+                'The same host can not exist in both "Report" and "Enforce" modes.'
+            );
+
+            // refresh page
+            await browser.refresh();
+
+            // check that policy wasn't created - doesn't exist
+            let tdWithPolicyNameExists = await $(
+                `td=${policyName}`
+            ).isExisting();
+            await expect(tdWithPolicyNameExists).toBe(false);
+        }
+    );
+
+    // cleanup after tests
+    afterEach(async () => {
+        // if executed test name matches - cleanup
+        if (
+            currentTest ===
+            TEST_ENFORCE_AND_REPORT_WITH_TWO_HOSTS_STAR_OR_EMPTY_CANNOT_BE_USED_AS_HOST
+        ) {
+            await browser.newUser();
+            await browser.url(`/domain/athenz.dev.functional-test/service`);
+            await expect(browser).toHaveUrl(expect.stringContaining('athenz'));
+
+            let deleteSvg = await $(
+                `.//*[local-name()="svg" and @id="delete-service-${SERVICE_NAME_TWO_HOSTS}"]`
+            );
+            if (deleteSvg.isExisting()) {
+                // attempt to delete only if service exists
+                await deleteSvg.click();
+                await $('button*=Delete').click();
+            } else {
+                console.warn(
+                    `SERVICE FOR DELETION NOT FOUND: ${SERVICE_NAME_TWO_HOSTS}`
+                );
+            }
+        }
+        // reset current test
+        currentTest = '';
+    });
+});

ui/src/components/microsegmentation/AddSegmentation.js

@@ -341,7 +341,9 @@ class AddSegmentation extends React.Component {
         }
         if (
             firstConditionInstances.includes('*') ||
-            secondConditionInstances.includes('*')
+            firstConditionInstances.includes('') ||
+            secondConditionInstances.includes('*') ||
+            secondConditionInstances.includes('')
         ) {
             // If one condition has the wild card, any host listed on the second condition will be shared with it.
             return false;
@@ -1319,6 +1321,7 @@ class AddSegmentation extends React.Component {
                 <SectionDiv>
                     <StyledInputLabel>Identifier</StyledInputLabel>
                     <StyledInput
+                        data-wdio='identifier'
                         placeholder='Enter a unique identifier for this ACL policy'
                         value={this.state.identifier}
                         onChange={(event) =>
@@ -1434,6 +1437,7 @@ class AddSegmentation extends React.Component {
                                     placeholder='Comma separated list, Leave blank to apply to all hosts'
                                     value={x.instances}
                                     name={'instances' + i}
+                                    data-wdio={'instances' + i}
                                     onChange={(e) =>
                                         this.handleInputChange(e, i)
                                     }
@@ -1450,6 +1454,7 @@ class AddSegmentation extends React.Component {
                                     <AddCircleDiv>
                                         <Icon
                                             icon={'add-circle'}
+                                            dataWdio={'add-circle'}
                                             isLink
                                             color={colors.icons}
                                             size='1.75em'
@@ -1482,6 +1487,7 @@ class AddSegmentation extends React.Component {
                     </StyledInputLabel>
                     <ContentDiv>
                         <StyledInput
+                            data-wdio='destination-port'
                             placeholder='eg: 4443'
                             value={
                                 this.state.isCategory
@@ -1508,6 +1514,7 @@ class AddSegmentation extends React.Component {
                             : 'Destination Service'}
                     </StyledInputLabel>
                     <StyledInput
+                        data-wdio='source-service'
                         placeholder='eg: yamas.api, sys.auth.zms'
                         value={
                             this.state.isCategory

ui/src/components/service/AddServiceForm.js

@@ -95,6 +95,7 @@ export default class AddServiceForm extends React.Component {
                     </StyledInputLabel>
                     <ContentDiv>
                         <StyledInput
+                            data-wdio='service-name'
                             id='service-name'
                             name='service-name'
                             value={this.state.name ? this.state.name : ''}