Apply missing v-readonly style to CheckBoxGroup, when component is readOnly (#11370)

Setting read-only state to CheckBoxGroup should disable adding clicking effect. Missing v-readonly style is added to every CheckBox in the component, if it's set to read-only.

Fixes: https://github.com/vaadin/framework/issues/11113

* Add file missed from initial commit

* Verifying that option is enabled

Some of the options might be disabled on there own. Verify that option is not disabled, before removing disabled styles.

* Add missing test file

client/src/main/java/com/vaadin/client/ui/VCheckBoxGroup.java

@@ -137,6 +137,7 @@ public class VCheckBoxGroup extends FocusableFlowPanelComposite
         widget.setValue(
                 item.getBoolean(ListingJsonConstants.JSONKEY_ITEM_SELECTED));
         setOptionEnabled(widget, item);
+        setOptionReadOnly(widget, item);
         widget.setStyleName(CLASSNAME_OPTION_SELECTED, widget.getValue());
 
         if (requireInitialization) {
@@ -197,6 +198,18 @@ public class VCheckBoxGroup extends FocusableFlowPanelComposite
                 !isEnabled() || !optionEnabled);
     }
 
+    protected void setOptionReadOnly(VCheckBox checkBox, JsonObject item) {
+        if (isReadonly()) {
+            checkBox.addStyleName("v-readonly");
+            checkBox.setEnabled(false);
+        } else {
+            checkBox.removeStyleName("v-readonly");
+            boolean optionEnabled = !item
+                    .getBoolean(ListingJsonConstants.JSONKEY_ITEM_DISABLED);
+            checkBox.setEnabled(isEnabled() && optionEnabled);
+        }
+    }
+
     public boolean isHtmlContentAllowed() {
         return htmlContentAllowed;
     }
@@ -217,7 +230,7 @@ public class VCheckBoxGroup extends FocusableFlowPanelComposite
     public void setReadonly(boolean readonly) {
         if (this.readonly != readonly) {
             this.readonly = readonly;
-            optionsToItems.forEach(this::setOptionEnabled);
+            optionsToItems.forEach(this::setOptionReadOnly);
         }
     }
 

uitest/src/main/java/com/vaadin/tests/components/checkboxgroup/CheckBoxGroupReadOnly.java

@@ -0,0 +1,30 @@
+package com.vaadin.tests.components.checkboxgroup;
+
+import com.vaadin.annotations.Widgetset;
+import com.vaadin.server.VaadinRequest;
+import com.vaadin.tests.components.AbstractTestUI;
+import com.vaadin.ui.CheckBoxGroup;
+import com.vaadin.ui.Button;
+
+@Widgetset("com.vaadin.DefaultWidgetSet")
+public class CheckBoxGroupReadOnly extends AbstractTestUI {
+    @Override
+    protected void setup(VaadinRequest request) {
+        CheckBoxGroup<Integer> cbg = new CheckBoxGroup<>();
+        cbg.setId("cbg");
+        cbg.setItems(1, 2, 3, 4);
+        cbg.setReadOnly(true);
+        addComponent(cbg);
+
+        Button changeReadOnly = new Button("Change Read-Only", e -> {
+            cbg.setReadOnly(!cbg.isReadOnly());
+        });
+        changeReadOnly.setId("changeReadOnly");
+        Button changeEnabled = new Button("Change Enabled", e -> {
+            cbg.setEnabled(!cbg.isEnabled());
+        });
+        changeEnabled.setId("changeEnabled");
+        addComponent(changeReadOnly);
+        addComponent(changeEnabled);
+    }
+}

uitest/src/test/java/com/vaadin/tests/components/checkboxgroup/CheckBoxGroupReadOnlyTest.java

@@ -0,0 +1,46 @@
+package com.vaadin.tests.components.checkboxgroup;
+
+import com.vaadin.testbench.elements.CheckBoxGroupElement;
+import com.vaadin.tests.tb3.MultiBrowserTest;
+import org.junit.Test;
+import org.openqa.selenium.By;
+import org.openqa.selenium.WebElement;
+
+import java.util.List;
+
+import static junit.framework.TestCase.assertEquals;
+import static junit.framework.TestCase.assertTrue;
+
+public class CheckBoxGroupReadOnlyTest extends MultiBrowserTest {
+
+    @Test
+    public void itemsAreReadOnly() {
+        openTestURL();
+        // Initially components are read-only
+        assertTrue(getSelect().isReadOnly());
+        assertEquals(4, findReadOnlyCheckboxes().size());
+        // Should not contain v-readonly
+        findElement(By.id("changeReadOnly")).click();
+        assertEquals(0, findReadOnlyCheckboxes().size());
+
+        // Should not contain v-readonly
+        findElement(By.id("changeEnabled")).click();
+        assertEquals(0, findReadOnlyCheckboxes().size());
+
+        // make read-only
+        findElement(By.id("changeReadOnly")).click();
+        // enable
+        findElement(By.id("changeEnabled")).click();
+        // Should contain v-readonly
+        assertEquals(4, findReadOnlyCheckboxes().size());
+    }
+
+    protected CheckBoxGroupElement getSelect() {
+        return $(CheckBoxGroupElement.class).first();
+    }
+
+    private List<WebElement> findReadOnlyCheckboxes() {
+        return findElement(By.id("cbg"))
+                .findElements(By.cssSelector("span.v-readonly.v-checkbox"));
+    }
+}