@zohodesk/components 1.6.31 → 1.6.34

package/lib/MultiSelect/__tests__/EmptyState.spec.js

@@ -9,6 +9,9 @@ var _EmptyState = _interopRequireDefault(require("../EmptyState"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 describe('EmptyState', function () {
+  afterEach(function () {
+    return (0, _react2.cleanup)();
+  });
   test('rendering the defult props', function () {
     var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
       searchString: [],
@@ -17,6 +20,276 @@ describe('EmptyState', function () {
     })),
         asFragment = _render.asFragment;
 
+    expect(asFragment()).toMatchSnapshot();
+  }); // searchString, suggestions and options are read without defaults, so every case below supplies all three
+
+  var option = {
+    id: 1,
+    value: 'Option 1'
+  };
+  test('Render with isLoading', function () {
+    var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      isLoading: true,
+      searchString: "",
+      suggestions: [],
+      options: []
+    })),
+        asFragment = _render2.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Render with isLoading and i18nKeys loadingText', function () {
+    var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      isLoading: true,
+      searchString: "",
+      suggestions: [],
+      options: [],
+      i18nKeys: {
+        loadingText: 'Fetching options'
+      }
+    })),
+        asFragment = _render3.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  }); // isLoading wins over the search and empty branches
+
+  test('Render with isLoading, searchString and no suggestions', function () {
+    var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      isLoading: true,
+      searchString: "abc",
+      suggestions: [],
+      options: []
+    })),
+        asFragment = _render4.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Render with searchString and no suggestions', function () {
+    var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      searchString: "abc",
+      suggestions: [],
+      options: [option]
+    })),
+        asFragment = _render5.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Render with searchString, no suggestions and searchEmptyMessage', function () {
+    var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      searchString: "abc",
+      suggestions: [],
+      options: [option],
+      searchEmptyMessage: "No matches found"
+    })),
+        asFragment = _render6.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Render with searchString, no suggestions and i18nKeys searchEmptyText', function () {
+    var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      searchString: "abc",
+      suggestions: [],
+      options: [option],
+      i18nKeys: {
+        searchEmptyText: 'Nothing matches'
+      }
+    })),
+        asFragment = _render7.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  }); // the search message falls back to the empty message when no search message is set
+
+  test('Render with searchString, no suggestions and emptyMessage', function () {
+    var _render8 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      searchString: "abc",
+      suggestions: [],
+      options: [option],
+      emptyMessage: "No options"
+    })),
+        asFragment = _render8.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Render with searchString, no suggestions and getCustomEmptyState', function () {
+    var _render9 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      searchString: "abc",
+      suggestions: [],
+      options: [option],
+      getCustomEmptyState: function getCustomEmptyState() {
+        return /*#__PURE__*/_react["default"].createElement("div", null, "Custom search empty state");
+      }
+    })),
+        asFragment = _render9.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Render with emptyMessage and no options', function () {
+    var _render10 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      searchString: "",
+      suggestions: [],
+      options: [],
+      emptyMessage: "No options"
+    })),
+        asFragment = _render10.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Render with i18nKeys emptyText and no options', function () {
+    var _render11 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      searchString: "",
+      suggestions: [],
+      options: [],
+      i18nKeys: {
+        emptyText: 'Nothing here'
+      }
+    })),
+        asFragment = _render11.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Render with renderCustomEmptyState as function and no options', function () {
+    var _render12 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      searchString: "",
+      suggestions: [],
+      options: [],
+      emptyMessage: "No options",
+      renderCustomEmptyState: function renderCustomEmptyState(_ref) {
+        var title = _ref.title;
+        return /*#__PURE__*/_react["default"].createElement("span", null, title);
+      }
+    })),
+        asFragment = _render12.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Render with renderCustomEmptyState as node and no options', function () {
+    var _render13 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      searchString: "",
+      suggestions: [],
+      options: [],
+      renderCustomEmptyState: /*#__PURE__*/_react["default"].createElement("span", null, "Custom empty state")
+    })),
+        asFragment = _render13.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  }); // options exist but none are left to suggest, so the no-more message is shown
+
+  test('Render with options and no suggestions', function () {
+    var _render14 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      searchString: "",
+      suggestions: [],
+      options: [option]
+    })),
+        asFragment = _render14.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Render with noMoreOptionsMessage, options and no suggestions', function () {
+    var _render15 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      searchString: "",
+      suggestions: [],
+      options: [option],
+      noMoreOptionsMessage: "No more options"
+    })),
+        asFragment = _render15.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Render with i18nKeys noMoreText, options and no suggestions', function () {
+    var _render16 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      searchString: "",
+      suggestions: [],
+      options: [option],
+      i18nKeys: {
+        noMoreText: 'Nothing more to pick'
+      }
+    })),
+        asFragment = _render16.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  }); // the no-more message falls back to the empty message when no no-more message is set
+
+  test('Render with emptyMessage, options and no suggestions', function () {
+    var _render17 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      searchString: "",
+      suggestions: [],
+      options: [option],
+      emptyMessage: "No options"
+    })),
+        asFragment = _render17.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Render with renderCustomEmptyState as function, options and no suggestions', function () {
+    var _render18 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      searchString: "",
+      suggestions: [],
+      options: [option],
+      noMoreOptionsMessage: "No more options",
+      renderCustomEmptyState: function renderCustomEmptyState(_ref2) {
+        var title = _ref2.title;
+        return /*#__PURE__*/_react["default"].createElement("span", null, title);
+      }
+    })),
+        asFragment = _render18.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  }); // a search with suggestions present is not an empty search, so the no-more branch applies
+
+  test('Render with searchString and suggestions', function () {
+    var _render19 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      searchString: "abc",
+      suggestions: [option],
+      options: [option]
+    })),
+        asFragment = _render19.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Render with palette as dark', function () {
+    var _render20 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      palette: "dark",
+      searchString: "",
+      suggestions: [],
+      options: []
+    })),
+        asFragment = _render20.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Render with dataId', function () {
+    var _render21 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      dataId: "empty-state-dataId",
+      searchString: "",
+      suggestions: [],
+      options: []
+    })),
+        asFragment = _render21.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Render with htmlId', function () {
+    var _render22 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      htmlId: "empty-state-htmlId",
+      searchString: "",
+      suggestions: [],
+      options: []
+    })),
+        asFragment = _render22.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Render with a11y role', function () {
+    var _render23 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+      a11y: {
+        role: 'status'
+      },
+      searchString: "",
+      suggestions: [],
+      options: []
+    })),
+        asFragment = _render23.asFragment;
+
     expect(asFragment()).toMatchSnapshot();
   });
 });