@pie-lib/charting 7.0.13 → 7.1.0-beta

package/lib/__tests__/chart-setup.test.js

@@ -0,0 +1,796 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@testing-library/react");
+var _styles = require("@mui/material/styles");
+var _chartSetup = _interopRequireWildcard(require("../chart-setup"));
+var _excluded = ["label", "value", "onChange"];
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+jest.mock('../chart-type', function () {
+  return function ChartType(_ref) {
+    var value = _ref.value,
+      onChange = _ref.onChange;
+    return /*#__PURE__*/_react["default"].createElement("select", {
+      "data-testid": "chart-type-select",
+      value: value,
+      onChange: onChange
+    }, /*#__PURE__*/_react["default"].createElement("option", {
+      value: "bar"
+    }, "Bar"), /*#__PURE__*/_react["default"].createElement("option", {
+      value: "line"
+    }, "Line"), /*#__PURE__*/_react["default"].createElement("option", {
+      value: "linePlot"
+    }, "Line Plot"), /*#__PURE__*/_react["default"].createElement("option", {
+      value: "dotPlot"
+    }, "Dot Plot"));
+  };
+});
+jest.mock('@pie-lib/config-ui', function () {
+  return {
+    NumberTextFieldCustom: function NumberTextFieldCustom(_ref2) {
+      var label = _ref2.label,
+        value = _ref2.value,
+        _onChange = _ref2.onChange,
+        props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
+      return /*#__PURE__*/_react["default"].createElement("input", (0, _extends2["default"])({
+        "data-testid": "number-field-".concat(label.toLowerCase().replace(/\s+/g, '-')),
+        type: "number",
+        value: value,
+        onChange: function onChange(e) {
+          return _onChange(e, parseFloat(e.target.value) || 0);
+        },
+        "aria-label": label
+      }, props));
+    },
+    AlertDialog: function AlertDialog(_ref3) {
+      var open = _ref3.open,
+        title = _ref3.title,
+        text = _ref3.text,
+        onClose = _ref3.onClose,
+        onConfirm = _ref3.onConfirm;
+      return open ? /*#__PURE__*/_react["default"].createElement("div", {
+        "data-testid": "alert-dialog"
+      }, /*#__PURE__*/_react["default"].createElement("h2", null, title), /*#__PURE__*/_react["default"].createElement("p", null, text), /*#__PURE__*/_react["default"].createElement("button", {
+        "data-testid": "alert-cancel",
+        onClick: onClose
+      }, "Cancel"), /*#__PURE__*/_react["default"].createElement("button", {
+        "data-testid": "alert-confirm",
+        onClick: onConfirm
+      }, "Confirm")) : null;
+    }
+  };
+});
+var theme;
+beforeAll(function () {
+  theme = (0, _styles.createTheme)();
+});
+describe('resetValues', function () {
+  var data;
+  var range;
+  var model;
+  var onChange;
+  beforeEach(function () {
+    range = {
+      min: 0,
+      max: 10,
+      step: 1
+    };
+    data = [{
+      value: 2
+    }, {
+      value: 11
+    }, {
+      value: 5.5
+    }, {
+      value: 2.0000000001
+    }, {
+      value: 2.9999999999
+    }];
+    model = {
+      someField: 'someValue',
+      data: data
+    };
+    onChange = jest.fn();
+  });
+  it('should reset values greater than range.max to zero', function () {
+    (0, _chartSetup.resetValues)(data, true, range, onChange, model);
+    expect(data[1].value).toBe(0);
+  });
+  it('should reset values that are not multiples of range.step to zero', function () {
+    (0, _chartSetup.resetValues)(data, true, range, onChange, model);
+    expect(data[2].value).toBe(0);
+  });
+  it('should not reset values that are within range and multiples of range.step', function () {
+    (0, _chartSetup.resetValues)(data, true, range, onChange, model);
+    expect(data[0].value).toBe(2);
+  });
+  it('should not reset floating point values that are close to multiples of range.step', function () {
+    (0, _chartSetup.resetValues)(data, true, range, onChange, model);
+    expect(data[3].value).toBe(2.0000000001);
+    expect(data[4].value).toBe(2.9999999999);
+  });
+  it('should not call onChange when updateModel is false', function () {
+    (0, _chartSetup.resetValues)(data, false, range, onChange, model);
+    expect(onChange).not.toHaveBeenCalled();
+  });
+  it('should handle null or undefined data array', function () {
+    expect(function () {
+      return (0, _chartSetup.resetValues)(null, true, range, onChange, model);
+    }).not.toThrow();
+    expect(function () {
+      return (0, _chartSetup.resetValues)(undefined, true, range, onChange, model);
+    }).not.toThrow();
+  });
+  it('should handle empty data array', function () {
+    (0, _chartSetup.resetValues)([], true, range, onChange, model);
+    expect(onChange).toHaveBeenCalledWith(_objectSpread(_objectSpread({}, model), {}, {
+      data: []
+    }));
+  });
+  it('should reset multiple invalid values', function () {
+    var multiData = [{
+      value: 11
+    }, {
+      value: 12
+    }, {
+      value: 5.5
+    }, {
+      value: 3.7
+    }];
+    (0, _chartSetup.resetValues)(multiData, true, range, onChange, _objectSpread(_objectSpread({}, model), {}, {
+      data: multiData
+    }));
+    expect(multiData.every(function (d) {
+      return d.value === 0;
+    })).toBe(true);
+  });
+  it('should handle decimal step values', function () {
+    var decimalRange = {
+      min: 0,
+      max: 10,
+      step: 0.5
+    };
+    var decimalData = [{
+      value: 1.5
+    }, {
+      value: 2.3
+    }, {
+      value: 3.0
+    }];
+    (0, _chartSetup.resetValues)(decimalData, true, decimalRange, onChange, model);
+    expect(decimalData[0].value).toBe(1.5);
+    expect(decimalData[1].value).toBe(0);
+    expect(decimalData[2].value).toBe(3.0);
+  });
+});
+describe('ConfigureChartPanel', function () {
+  var defaultModel = {
+    chartType: 'bar',
+    range: {
+      min: 0,
+      max: 10,
+      step: 1,
+      labelStep: 1
+    },
+    graph: {
+      width: 400,
+      height: 500
+    },
+    data: [{
+      value: 5
+    }],
+    correctAnswer: {
+      data: [{
+        value: 3
+      }]
+    },
+    changeInteractiveEnabled: true,
+    changeEditableEnabled: true
+  };
+  var defaultProps = {
+    model: defaultModel,
+    onChange: jest.fn(),
+    chartDimensions: {
+      showInConfigPanel: true,
+      width: {
+        min: 50,
+        max: 700,
+        step: 20
+      },
+      height: {
+        min: 400,
+        max: 700,
+        step: 20
+      }
+    },
+    gridValues: {
+      range: {
+        min: 0,
+        max: 10000
+      }
+    },
+    labelValues: {
+      range: {
+        min: 0,
+        max: 10000
+      }
+    },
+    studentNewCategoryDefaultLabel: {
+      label: 'Category'
+    },
+    availableChartTypes: {},
+    chartTypeLabel: 'Chart Type'
+  };
+  beforeEach(function () {
+    jest.clearAllMocks();
+  });
+  var renderComponent = function renderComponent() {
+    var extras = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    var props = _objectSpread(_objectSpread({}, defaultProps), extras);
+    return (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_styles.ThemeProvider, {
+      theme: theme
+    }, /*#__PURE__*/_react["default"].createElement(_chartSetup["default"], props)));
+  };
+  describe('rendering', function () {
+    it('should render without crashing', function () {
+      var _renderComponent = renderComponent(),
+        container = _renderComponent.container;
+      expect(container).toBeInTheDocument();
+    });
+    it('should render "Configure Chart" title', function () {
+      var _renderComponent2 = renderComponent(),
+        getByText = _renderComponent2.getByText;
+      expect(getByText('Configure Chart')).toBeInTheDocument();
+    });
+    it('should render chart type selector', function () {
+      var _renderComponent3 = renderComponent(),
+        getByTestId = _renderComponent3.getByTestId;
+      expect(getByTestId('chart-type-select')).toBeInTheDocument();
+    });
+    it('should render max value field', function () {
+      var _renderComponent4 = renderComponent(),
+        getByLabelText = _renderComponent4.getByLabelText;
+      expect(getByLabelText('Max Value')).toBeInTheDocument();
+    });
+    it('should render grid interval field for non-plot charts', function () {
+      var _renderComponent5 = renderComponent({
+          model: _objectSpread(_objectSpread({}, defaultModel), {}, {
+            chartType: 'bar'
+          })
+        }),
+        getByLabelText = _renderComponent5.getByLabelText;
+      expect(getByLabelText('Grid Interval')).toBeInTheDocument();
+    });
+    it('should render label interval field for non-plot charts', function () {
+      var _renderComponent6 = renderComponent({
+          model: _objectSpread(_objectSpread({}, defaultModel), {}, {
+            chartType: 'bar'
+          })
+        }),
+        getByLabelText = _renderComponent6.getByLabelText;
+      expect(getByLabelText('Label Interval')).toBeInTheDocument();
+    });
+    it('should not render step config for plot charts', function () {
+      var _renderComponent7 = renderComponent({
+          model: _objectSpread(_objectSpread({}, defaultModel), {}, {
+            chartType: 'linePlot'
+          })
+        }),
+        queryByLabelText = _renderComponent7.queryByLabelText;
+      expect(queryByLabelText('Grid Interval')).not.toBeInTheDocument();
+      expect(queryByLabelText('Label Interval')).not.toBeInTheDocument();
+    });
+    it('should render dimensions section when showInConfigPanel is true', function () {
+      var _renderComponent8 = renderComponent({
+          chartDimensions: {
+            showInConfigPanel: true,
+            width: {
+              min: 50,
+              max: 700,
+              step: 20
+            },
+            height: {
+              min: 400,
+              max: 700,
+              step: 20
+            }
+          }
+        }),
+        getByText = _renderComponent8.getByText;
+      expect(getByText('Dimensions(px)')).toBeInTheDocument();
+    });
+    it('should not render dimensions section when showInConfigPanel is false', function () {
+      var _renderComponent9 = renderComponent({
+          chartDimensions: {
+            showInConfigPanel: false,
+            width: {
+              min: 50,
+              max: 700,
+              step: 20
+            },
+            height: {
+              min: 400,
+              max: 700,
+              step: 20
+            }
+          }
+        }),
+        queryByText = _renderComponent9.queryByText;
+      expect(queryByText('Dimensions(px)')).not.toBeInTheDocument();
+    });
+    it('should render width field when dimensions are shown', function () {
+      var _renderComponent0 = renderComponent(),
+        getByLabelText = _renderComponent0.getByLabelText;
+      expect(getByLabelText('Width')).toBeInTheDocument();
+    });
+    it('should render height field when dimensions are shown', function () {
+      var _renderComponent1 = renderComponent(),
+        getByLabelText = _renderComponent1.getByLabelText;
+      expect(getByLabelText('Height')).toBeInTheDocument();
+    });
+    it('should display width constraints', function () {
+      var _renderComponent10 = renderComponent(),
+        getByText = _renderComponent10.getByText;
+      expect(getByText('Min 50, Max 700')).toBeInTheDocument();
+    });
+    it('should display height constraints', function () {
+      var _renderComponent11 = renderComponent(),
+        getAllByText = _renderComponent11.getAllByText;
+      var constraints = getAllByText('Min 400, Max 700');
+      expect(constraints.length).toBeGreaterThan(0);
+    });
+  });
+  describe('chart type changes', function () {
+    it('should call onChange when chart type is changed to non-plot', function () {
+      var onChange = jest.fn();
+      var _renderComponent12 = renderComponent({
+          onChange: onChange
+        }),
+        getByTestId = _renderComponent12.getByTestId;
+      _react2.fireEvent.change(getByTestId('chart-type-select'), {
+        target: {
+          value: 'line'
+        }
+      });
+      expect(onChange).toHaveBeenCalled();
+    });
+    it('should show warning when switching to plot with invalid config', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee() {
+      var _renderComponent13, getByTestId, getByText;
+      return _regenerator["default"].wrap(function (_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            _renderComponent13 = renderComponent({
+              model: _objectSpread(_objectSpread({}, defaultModel), {}, {
+                range: {
+                  max: 20,
+                  step: 2,
+                  labelStep: 2
+                }
+              })
+            }), getByTestId = _renderComponent13.getByTestId, getByText = _renderComponent13.getByText;
+            _react2.fireEvent.change(getByTestId('chart-type-select'), {
+              target: {
+                value: 'linePlot'
+              }
+            });
+            _context.next = 1;
+            return (0, _react2.waitFor)(function () {
+              expect(getByText('Warning')).toBeInTheDocument();
+            });
+          case 1:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    })));
+    it('should allow switching to plot with valid config', function () {
+      var onChange = jest.fn();
+      var _renderComponent14 = renderComponent({
+          onChange: onChange,
+          model: _objectSpread(_objectSpread({}, defaultModel), {}, {
+            range: {
+              max: 10,
+              step: 1,
+              labelStep: 1
+            }
+          })
+        }),
+        getByTestId = _renderComponent14.getByTestId;
+      _react2.fireEvent.change(getByTestId('chart-type-select'), {
+        target: {
+          value: 'dotPlot'
+        }
+      });
+      expect(onChange).toHaveBeenCalledWith(expect.objectContaining({
+        chartType: 'dotPlot'
+      }));
+    });
+  });
+  describe('range changes', function () {
+    it('should update max value', function () {
+      var onChange = jest.fn();
+      var _renderComponent15 = renderComponent({
+          onChange: onChange
+        }),
+        getByLabelText = _renderComponent15.getByLabelText;
+      var maxInput = getByLabelText('Max Value');
+      _react2.fireEvent.change(maxInput, {
+        target: {
+          value: '15'
+        }
+      });
+      expect(onChange).toHaveBeenCalled();
+    });
+    it('should update step value', function () {
+      var onChange = jest.fn();
+      var _renderComponent16 = renderComponent({
+          onChange: onChange
+        }),
+        getByLabelText = _renderComponent16.getByLabelText;
+      var stepInput = getByLabelText('Grid Interval');
+      _react2.fireEvent.change(stepInput, {
+        target: {
+          value: '2'
+        }
+      });
+      expect(onChange).toHaveBeenCalled();
+    });
+    it('should update label step value', function () {
+      var onChange = jest.fn();
+      var _renderComponent17 = renderComponent({
+          onChange: onChange
+        }),
+        getByLabelText = _renderComponent17.getByLabelText;
+      var labelStepInput = getByLabelText('Label Interval');
+      _react2.fireEvent.change(labelStepInput, {
+        target: {
+          value: '2'
+        }
+      });
+      expect(onChange).toHaveBeenCalled();
+    });
+    it('should show alert when changing max causes data to be out of range', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee2() {
+      var onChange, _renderComponent18, getByLabelText, queryByTestId, maxInput;
+      return _regenerator["default"].wrap(function (_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
+          case 0:
+            onChange = jest.fn();
+            _renderComponent18 = renderComponent({
+              onChange: onChange,
+              model: _objectSpread(_objectSpread({}, defaultModel), {}, {
+                range: {
+                  min: 0,
+                  max: 10,
+                  step: 1,
+                  labelStep: 1
+                },
+                data: [{
+                  value: 8
+                }],
+                correctAnswer: {
+                  data: []
+                }
+              })
+            }), getByLabelText = _renderComponent18.getByLabelText, queryByTestId = _renderComponent18.queryByTestId;
+            maxInput = getByLabelText('Max Value');
+            _react2.fireEvent.change(maxInput, {
+              target: {
+                value: '5'
+              }
+            });
+            _context2.next = 1;
+            return (0, _react2.waitFor)(function () {
+              expect(onChange).toHaveBeenCalled();
+            });
+          case 1:
+          case "end":
+            return _context2.stop();
+        }
+      }, _callee2);
+    })));
+    it('should show alert when changing step causes data to be out of range', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee3() {
+      var onChange, _renderComponent19, getByLabelText, stepInput;
+      return _regenerator["default"].wrap(function (_context3) {
+        while (1) switch (_context3.prev = _context3.next) {
+          case 0:
+            onChange = jest.fn();
+            _renderComponent19 = renderComponent({
+              onChange: onChange,
+              model: _objectSpread(_objectSpread({}, defaultModel), {}, {
+                range: {
+                  min: 0,
+                  max: 10,
+                  step: 1,
+                  labelStep: 1
+                },
+                data: [{
+                  value: 5
+                }],
+                correctAnswer: {
+                  data: []
+                }
+              })
+            }), getByLabelText = _renderComponent19.getByLabelText;
+            stepInput = getByLabelText('Grid Interval');
+            _react2.fireEvent.change(stepInput, {
+              target: {
+                value: '3'
+              }
+            });
+            _context3.next = 1;
+            return (0, _react2.waitFor)(function () {
+              expect(onChange).toHaveBeenCalled();
+            });
+          case 1:
+          case "end":
+            return _context3.stop();
+        }
+      }, _callee3);
+    })));
+  });
+  describe('dimensions changes', function () {
+    it('should update width', function () {
+      var onChange = jest.fn();
+      var _renderComponent20 = renderComponent({
+          onChange: onChange
+        }),
+        getByLabelText = _renderComponent20.getByLabelText;
+      var widthInput = getByLabelText('Width');
+      _react2.fireEvent.change(widthInput, {
+        target: {
+          value: '500'
+        }
+      });
+      expect(onChange).toHaveBeenCalledWith(expect.objectContaining({
+        graph: expect.objectContaining({
+          width: 500
+        })
+      }));
+    });
+    it('should update height', function () {
+      var onChange = jest.fn();
+      var _renderComponent21 = renderComponent({
+          onChange: onChange
+        }),
+        getByLabelText = _renderComponent21.getByLabelText;
+      var heightInput = getByLabelText('Height');
+      _react2.fireEvent.change(heightInput, {
+        target: {
+          value: '600'
+        }
+      });
+      expect(onChange).toHaveBeenCalledWith(expect.objectContaining({
+        graph: expect.objectContaining({
+          height: 600
+        })
+      }));
+    });
+  });
+  describe('alert dialog', function () {
+    it('should reset range on cancel', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee4() {
+      var onChange, _renderComponent22, getByLabelText, queryByTestId, maxInput, event;
+      return _regenerator["default"].wrap(function (_context4) {
+        while (1) switch (_context4.prev = _context4.next) {
+          case 0:
+            onChange = jest.fn();
+            _renderComponent22 = renderComponent({
+              onChange: onChange,
+              model: _objectSpread(_objectSpread({}, defaultModel), {}, {
+                range: {
+                  min: 0,
+                  max: 10,
+                  step: 1,
+                  labelStep: 1
+                },
+                data: [{
+                  value: 8
+                }],
+                correctAnswer: {
+                  data: []
+                }
+              })
+            }), getByLabelText = _renderComponent22.getByLabelText, queryByTestId = _renderComponent22.queryByTestId;
+            maxInput = getByLabelText('Max Value');
+            event = {
+              target: maxInput
+            };
+            _react2.fireEvent.change(maxInput, {
+              target: {
+                value: '5'
+              }
+            });
+            _context4.next = 1;
+            return (0, _react2.waitFor)(function () {
+              var dialog = queryByTestId('alert-dialog');
+              if (dialog) {
+                _react2.fireEvent.click(queryByTestId('alert-cancel'));
+              }
+            }, {
+              timeout: 100
+            })["catch"](function () {});
+          case 1:
+            expect(onChange).toHaveBeenCalled();
+          case 2:
+          case "end":
+            return _context4.stop();
+        }
+      }, _callee4);
+    })));
+    it('should apply changes and reset data on confirm', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee5() {
+      var onChange, _renderComponent23, getByLabelText, queryByTestId, maxInput;
+      return _regenerator["default"].wrap(function (_context5) {
+        while (1) switch (_context5.prev = _context5.next) {
+          case 0:
+            onChange = jest.fn();
+            _renderComponent23 = renderComponent({
+              onChange: onChange,
+              model: _objectSpread(_objectSpread({}, defaultModel), {}, {
+                range: {
+                  min: 0,
+                  max: 10,
+                  step: 1,
+                  labelStep: 1
+                },
+                data: [{
+                  value: 8
+                }],
+                correctAnswer: {
+                  data: []
+                }
+              })
+            }), getByLabelText = _renderComponent23.getByLabelText, queryByTestId = _renderComponent23.queryByTestId;
+            maxInput = getByLabelText('Max Value');
+            _react2.fireEvent.change(maxInput, {
+              target: {
+                value: '5'
+              }
+            });
+            _context5.next = 1;
+            return (0, _react2.waitFor)(function () {
+              var dialog = queryByTestId('alert-dialog');
+              if (dialog) {
+                _react2.fireEvent.click(queryByTestId('alert-confirm'));
+              }
+            }, {
+              timeout: 100
+            })["catch"](function () {});
+          case 1:
+            expect(onChange).toHaveBeenCalled();
+          case 2:
+          case "end":
+            return _context5.stop();
+        }
+      }, _callee5);
+    })));
+  });
+  describe('edge cases', function () {
+    it('should handle missing chartDimensions', function () {
+      var _renderComponent24 = renderComponent({
+          chartDimensions: undefined
+        }),
+        container = _renderComponent24.container;
+      expect(container).toBeInTheDocument();
+    });
+    it('should handle missing gridValues', function () {
+      var _renderComponent25 = renderComponent({
+          gridValues: undefined
+        }),
+        container = _renderComponent25.container;
+      expect(container).toBeInTheDocument();
+    });
+    it('should handle missing labelValues', function () {
+      var _renderComponent26 = renderComponent({
+          labelValues: undefined
+        }),
+        container = _renderComponent26.container;
+      expect(container).toBeInTheDocument();
+    });
+    it('should handle empty model data', function () {
+      var _renderComponent27 = renderComponent({
+          model: _objectSpread(_objectSpread({}, defaultModel), {}, {
+            data: [],
+            correctAnswer: {
+              data: []
+            }
+          })
+        }),
+        container = _renderComponent27.container;
+      expect(container).toBeInTheDocument();
+    });
+    it('should handle empty range object', function () {
+      var _renderComponent28 = renderComponent({
+          model: _objectSpread(_objectSpread({}, defaultModel), {}, {
+            range: {}
+          })
+        }),
+        container = _renderComponent28.container;
+      expect(container).toBeInTheDocument();
+    });
+    it('should apply width constraints correctly', function () {
+      var _renderComponent29 = renderComponent({
+          chartDimensions: {
+            showInConfigPanel: true,
+            width: {
+              min: 100,
+              max: 600,
+              step: 50
+            },
+            height: {
+              min: 400,
+              max: 700,
+              step: 20
+            }
+          }
+        }),
+        container = _renderComponent29.container;
+      expect(container).toBeInTheDocument();
+    });
+    it('should apply height constraints correctly', function () {
+      var _renderComponent30 = renderComponent({
+          chartDimensions: {
+            showInConfigPanel: true,
+            width: {
+              min: 50,
+              max: 700,
+              step: 20
+            },
+            height: {
+              min: 450,
+              max: 650,
+              step: 30
+            }
+          }
+        }),
+        container = _renderComponent30.container;
+      expect(container).toBeInTheDocument();
+    });
+    it('should handle very small step values', function () {
+      var _renderComponent31 = renderComponent({
+          chartDimensions: {
+            showInConfigPanel: true,
+            width: {
+              min: 50,
+              max: 700,
+              step: 0.5
+            },
+            height: {
+              min: 400,
+              max: 700,
+              step: 0.5
+            }
+          }
+        }),
+        container = _renderComponent31.container;
+      expect(container).toBeInTheDocument();
+    });
+  });
+  describe('useEffect lifecycle', function () {
+    it('should call onChange on mount', function () {
+      var onChange = jest.fn();
+      renderComponent({
+        onChange: onChange
+      });
+      expect(onChange).toHaveBeenCalled();
+    });
+    it('should set category default label on mount', function () {
+      var onChange = jest.fn();
+      renderComponent({
+        onChange: onChange,
+        studentNewCategoryDefaultLabel: {
+          label: 'Test Category'
+        }
+      });
+      expect(onChange).toHaveBeenCalled();
+    });
+  });
+});
+//# sourceMappingURL=chart-setup.test.js.map