1.2.1 (#66)

* Update changelog for 1.2.0 * Fix/#2 status codes (#65) * 1.2.0 (#62) * Update changelog for 1.2.0 * feat(security): prevent secrets from leaking to source control (#59) * feat(security): prevent secrets from leaking to source control * chore: update lint-staged pacakgeto use v9 * fix: update versions * fix(security): add secrets baseline * 🚧 Added two extra status codes * ✅ Unit checks now validates options groups * 🚧 Label is only visible as a label attribute * Update changelog for 1.2.1 * fix(security): clean up markdown (#64) * Update changelog for 1.2.1
boyney123 · Aug 13, 2019 · 49afec8 · 49afec8
1 parent 7677327
commit 49afec8
Show file tree

Hide file tree

Showing 5 changed files with 67 additions and 25 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,9 @@
+## 1.2.1
+
+- Added more status codes ([zecarrera](https://github.com/zecarrera) in [#65](https://github.com/boyney123/mockit/pull/65))
+
+- Clean up markdown #64 ([lirantal](https://github.com/lirantal) in [#64](https://github.com/boyney123/mockit/pull/64))
+
 ## 1.2.0
 
 - Prevent secrets from leaking to source control ([lirantal](https://github.com/lirantal) in [#59](https://github.com/boyney123/mockit/pull/59))

diff --git a/SECURITY.md b/SECURITY.md
@@ -40,4 +40,3 @@ sending the report over a secure medium.
 
 Your efforts to responsibly disclose your findings are sincerely appreciated and will be taken into account to acknowledge
 your contributions.
-```
diff --git a/client/src/components/RouteModal/index.js b/client/src/components/RouteModal/index.js
@@ -18,7 +18,9 @@ const STATUS_CODES = [
   StatusCodes.NOT_FOUND,
   StatusCodes.CONFLICT,
   StatusCodes.UNPROCESSABLE_ENTITY,
-  StatusCodes.INTERNAL_SERVER_ERROR
+  StatusCodes.INTERNAL_SERVER_ERROR,
+  StatusCodes.SERVICE_UNAVAILABLE,
+  StatusCodes.GATEWAY_TIMEOUT
 ];
 
 /**
@@ -83,6 +85,10 @@ const Modal = function(props) {
     }
   };
 
+  const statusCodeStartingWith = startingNumber => {
+    return STATUS_CODES.filter(routeStatusCode => routeStatusCode.startsWith(startingNumber));
+  };
+
   return (
     <>
       <div className="modal is-active" data-testid="route-modal">
@@ -123,13 +129,29 @@ const Modal = function(props) {
                 <label className="label">Status Code</label>
                 <div className="control">
                   <div className="select">
-                    <select aria-label="route-statuscode" value={statusCode} onChange={e => updateStatusCode(e.currentTarget.value)}>
-                      {STATUS_CODES.map(test => (
-                        <option key={test} value={test}>
-                          {test}
-                        </option>
-                      ))}
-                    </select>
+                      <select aria-label="route-statuscode" value={statusCode} onChange={e => updateStatusCode(e.currentTarget.value)}>
+                        <optgroup aria-label="2xx" label="2xx">
+                          {statusCodeStartingWith("2").map(routeStatusCode => 
+                            <option key={routeStatusCode} value={routeStatusCode}>
+                              {routeStatusCode}
+                            </option>
+                          )}
+                        </optgroup>
+                        <optgroup aria-label="4xx" label="4xx">
+                          {statusCodeStartingWith("4").map(routeStatusCode =>
+                            <option key={routeStatusCode} value={routeStatusCode}>
+                              {routeStatusCode}
+                            </option>
+                          )}
+                        </optgroup>
+                        <optgroup aria-label="5xx" label="5xx">
+                          {statusCodeStartingWith("5").map(routeStatusCode =>
+                            <option key={routeStatusCode} value={routeStatusCode}>
+                              {routeStatusCode}
+                            </option>
+                          )}
+                        </optgroup>
+                      </select>
                   </div>
                 </div>
               </div>
@@ -197,3 +219,4 @@ const Modal = function(props) {
 };
 
 export default Modal;
+
diff --git a/client/src/components/RouteModal/spec.js b/client/src/components/RouteModal/spec.js
@@ -60,25 +60,37 @@ describe("Route Modal", () => {
       expect(getByValue("PATCH", dropdownOptions)).toBeVisible();
     });
 
+    it("with a dropdown list with three groups", () => {
+      const route = buildRoute();
+      const { getByLabelText } = render(<RouteModal route={route} />);
+      const dropdown = getByLabelText("route-statuscode");
+      const dropdownOptionGroups = dropdown.childNodes;
+
+      expect(dropdownOptionGroups.length).toEqual(3);
+      expect(getByLabelText("2xx", dropdownOptionGroups)).toBeVisible();
+      expect(getByLabelText("4xx", dropdownOptionGroups)).toBeVisible();
+      expect(getByLabelText("5xx", dropdownOptionGroups)).toBeVisible();
+    });
+
     it("with a dropdown list of all available status code", () => {
       const route = buildRoute();
       const { getByLabelText, getByValue } = render(<RouteModal route={route} />);
       const dropdown = getByLabelText("route-statuscode");
-      const dropdownOptions = dropdown.children;
-
-      expect(dropdownOptions.length).toEqual(11);
-
-      expect(getByValue("200", dropdownOptions)).toBeVisible();
-      expect(getByValue("201", dropdownOptions)).toBeVisible();
-      expect(getByValue("202", dropdownOptions)).toBeVisible();
-      expect(getByValue("204", dropdownOptions)).toBeVisible();
-      expect(getByValue("400", dropdownOptions)).toBeVisible();
-      expect(getByValue("401", dropdownOptions)).toBeVisible();
-      expect(getByValue("403", dropdownOptions)).toBeVisible();
-      expect(getByValue("404", dropdownOptions)).toBeVisible();
-      expect(getByValue("409", dropdownOptions)).toBeVisible();
-      expect(getByValue("422", dropdownOptions)).toBeVisible();
-      expect(getByValue("500", dropdownOptions)).toBeVisible();
+      const dropdownOptionGroups = dropdown.childNodes;
+
+      expect(getByValue("200", dropdownOptionGroups[0].children)).toBeVisible();
+      expect(getByValue("201", dropdownOptionGroups[0].children)).toBeVisible();
+      expect(getByValue("202", dropdownOptionGroups[0].children)).toBeVisible();
+      expect(getByValue("204", dropdownOptionGroups[0].children)).toBeVisible();
+      expect(getByValue("400", dropdownOptionGroups[1].children)).toBeVisible();
+      expect(getByValue("401", dropdownOptionGroups[1].children)).toBeVisible();
+      expect(getByValue("403", dropdownOptionGroups[1].children)).toBeVisible();
+      expect(getByValue("404", dropdownOptionGroups[1].children)).toBeVisible();
+      expect(getByValue("409", dropdownOptionGroups[1].children)).toBeVisible();
+      expect(getByValue("422", dropdownOptionGroups[1].children)).toBeVisible();
+      expect(getByValue("500", dropdownOptionGroups[2].children)).toBeVisible();
+      expect(getByValue("503", dropdownOptionGroups[2].children)).toBeVisible();
+      expect(getByValue("504", dropdownOptionGroups[2].children)).toBeVisible();
     });
 
     it("with a dropdown list of all available delay values", () => {

diff --git a/client/src/utils/consts/index.js b/client/src/utils/consts/index.js
@@ -17,7 +17,9 @@ export const StatusCodes = {
   NOT_FOUND: "404",
   CONFLICT: "409",
   UNPROCESSABLE_ENTITY: "422",
-  INTERNAL_SERVER_ERROR: "500"
+  INTERNAL_SERVER_ERROR: "500",
+  SERVICE_UNAVAILABLE: "503",
+  GATEWAY_TIMEOUT: "504"
 };
 
 export const MOCKIT_SERVER_URL = process.env.REACT_APP_MOCKIT_SERVER_URL || "localhost:3000";