diff --git a/README.md b/README.md
index 76b91cd..6c4f549 100644
--- a/README.md
+++ b/README.md
@@ -932,8 +932,10 @@ To setup a local environment: clone this repo, navigate into it's directory in a
 | `npm run start`      | Fire up local server for development                         |
 | `npm run test:unit`  | Run sequence of tests once                                   |
 | `npm run test:unit:watch` | Fire up test server and re-test on file change          |
-| `npm run test:e2e`    | Run sequence of e2e tests                                   |
-| `npm run test`    | Run both unit and e2e tests                                 |
+| `npm run test:e2e`    | Run sequence of e2e tests (with local server)               |
+| `npm run test`    | Run both unit and e2e tests                                     |
+| `npm run cypress:open`    | Run Cypress e2e tests (GUI)                        |
+| `npm run cypress:run`    | Run Cypress e2e tests (CLI)                                  |
 | `npm run js:build`   | Compile Choices to an uglified JavaScript file               |
 | `npm run css:watch`  | Watch SCSS files for changes. On a change, run build process |
 | `npm run css:build`  | Compile, minify and prefix SCSS files to CSS                 |
diff --git a/cypress/integration/select-multiple.spec.js b/cypress/integration/select-multiple.spec.js
index af74c4e..ee4812c 100644
--- a/cypress/integration/select-multiple.spec.js
+++ b/cypress/integration/select-multiple.spec.js
@@ -564,5 +564,72 @@ describe('Choices - select multiple', () => {
         }
       });
     });
+
+    describe('choice groups', () => {
+      const choicesInGroup = 3;
+      let groupValue;
+
+      beforeEach(() => {
+        cy.get('[data-test-hook=groups]')
+          .find('.choices__list--dropdown .choices__list .choices__group')
+          .first()
+          .then($group => {
+            groupValue = $group.text().trim();
+          });
+      });
+
+      describe('selecting all choices in group', () => {
+        it('removes group from dropdown', () => {
+          for (let index = 0; index < choicesInGroup; index++) {
+            cy.get('[data-test-hook=groups]')
+              .find('.choices__input--cloned')
+              .focus();
+
+            cy.get('[data-test-hook=groups]')
+              .find('.choices__list--dropdown .choices__list .choices__item')
+              .first()
+              .click();
+          }
+
+          cy.get('[data-test-hook=groups]')
+            .find('.choices__list--dropdown .choices__list .choices__group')
+            .first()
+            .should($group => {
+              expect($group.text().trim()).to.not.equal(groupValue);
+            });
+        });
+      });
+
+      describe('deselecting all choices in group', () => {
+        beforeEach(() => {
+          for (let index = 0; index < choicesInGroup; index++) {
+            cy.get('[data-test-hook=groups]')
+              .find('.choices__input--cloned')
+              .focus();
+
+            cy.get('[data-test-hook=groups]')
+              .find('.choices__list--dropdown .choices__list .choices__item')
+              .first()
+              .click();
+          }
+        });
+
+        it('shows group in dropdown', () => {
+          for (let index = 0; index < choicesInGroup; index++) {
+            cy.get('[data-test-hook=groups]')
+              .find('.choices__input--cloned')
+              .focus()
+              .type('{backspace}');
+          }
+
+          cy.get('[data-test-hook=groups]')
+            .find('.choices__list--dropdown .choices__list .choices__group')
+            .first()
+            .should($group => {
+              expect($group.text().trim()).to.equal(groupValue);
+            });
+        });
+      });
+    });
   });
 });
diff --git a/cypress/integration/select-one.spec.js b/cypress/integration/select-one.spec.js
index 1be727f..494eebd 100644
--- a/cypress/integration/select-one.spec.js
+++ b/cypress/integration/select-one.spec.js
@@ -512,5 +512,72 @@ describe('Choices - select one', () => {
         }
       });
     });
+
+    describe('choice groups', () => {
+      const choicesInGroup = 3;
+      let groupValue;
+
+      beforeEach(() => {
+        cy.get('[data-test-hook=groups]')
+          .find('.choices__list--dropdown .choices__list .choices__group')
+          .first()
+          .then($group => {
+            groupValue = $group.text().trim();
+          });
+      });
+
+      describe('selecting all choices in group', () => {
+        it('removes group from dropdown', () => {
+          for (let index = 0; index < choicesInGroup; index++) {
+            cy.get('[data-test-hook=groups]')
+              .find('.choices__input--cloned')
+              .focus();
+
+            cy.get('[data-test-hook=groups]')
+              .find('.choices__list--dropdown .choices__list .choices__item')
+              .first()
+              .click();
+          }
+
+          cy.get('[data-test-hook=groups]')
+            .find('.choices__list--dropdown .choices__list .choices__group')
+            .first()
+            .should($group => {
+              expect($group.text().trim()).to.not.equal(groupValue);
+            });
+        });
+      });
+
+      describe('deselecting all choices in group', () => {
+        beforeEach(() => {
+          for (let index = 0; index < choicesInGroup; index++) {
+            cy.get('[data-test-hook=groups]')
+              .find('.choices__input--cloned')
+              .focus();
+
+            cy.get('[data-test-hook=groups]')
+              .find('.choices__list--dropdown .choices__list .choices__item')
+              .first()
+              .click();
+          }
+        });
+
+        it('shows group in dropdown', () => {
+          for (let index = 0; index < choicesInGroup; index++) {
+            cy.get('[data-test-hook=groups]')
+              .find('.choices__input--cloned')
+              .focus()
+              .type('{backspace}');
+          }
+
+          cy.get('[data-test-hook=groups]')
+            .find('.choices__list--dropdown .choices__list .choices__group')
+            .first()
+            .should($group => {
+              expect($group.text().trim()).to.equal(groupValue);
+            });
+        });
+      });
+    });
   });
 });
diff --git a/public/test/select-multiple.html b/public/test/select-multiple.html
index 4186339..eb8be63 100644
--- a/public/test/select-multiple.html
+++ b/public/test/select-multiple.html
@@ -141,6 +141,22 @@
             <option value="Dropdown item 15">Dropdown item 15</option>
           </select>
         </div>
+
+        <div data-test-hook="groups">
+          <label for="choices-groups">Choice groups</label>
+          <select class="form-control" name="choices-groups" id="choices-groups" multiple>
+            <optgroup label="UK">
+              <option value="London">London</option>
+              <option value="Manchester">Manchester</option>
+              <option value="Liverpool">Liverpool</option>
+            </optgroup>
+            <optgroup label="FR">
+              <option value="Paris">Paris</option>
+              <option value="Lyon">Lyon</option>
+              <option value="Marseille">Marseille</option>
+            </optgroup>
+          </select>
+        </div>
       </div>
     </div>
     <script>
@@ -196,6 +212,8 @@
         new Choices('#choices-scrolling-dropdown', {
           shouldSort: false,
         });
+
+        new Choices('#choices-groups');
       });
     </script>
   </body>
diff --git a/public/test/select-one.html b/public/test/select-one.html
index aa5d802..f6d20ff 100644
--- a/public/test/select-one.html
+++ b/public/test/select-one.html
@@ -129,6 +129,22 @@
             <option value="Dropdown item 15">Dropdown item 15</option>
           </select>
         </div>
+
+        <div data-test-hook="groups">
+          <label for="choices-groups">Choice groups</label>
+          <select class="form-control" name="choices-groups" id="choices-groups" multiple>
+            <optgroup label="UK">
+              <option value="London">London</option>
+              <option value="Manchester">Manchester</option>
+              <option value="Liverpool">Liverpool</option>
+            </optgroup>
+            <optgroup label="FR">
+              <option value="Paris">Paris</option>
+              <option value="Lyon">Lyon</option>
+              <option value="Marseille">Marseille</option>
+            </optgroup>
+          </select>
+        </div>
       </div>
     </div>
     <script>
@@ -181,6 +197,8 @@
         new Choices('#choices-scrolling-dropdown', {
           shouldSort: false,
         });
+
+        new Choices('#choices-groups');
       });
     </script>
   </body>