@pie-lib/charting 7.0.13 → 7.1.0-beta

package/lib/common/__tests__/correctness-indicators.test.js

@@ -0,0 +1,887 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@testing-library/react");
+var _styles = require("@mui/material/styles");
+var _correctnessIndicators = require("../correctness-indicators");
+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('@pie-lib/render-ui', function () {
+  return {
+    color: {
+      correct: function correct() {
+        return '#00ff00';
+      },
+      incorrectWithIcon: function incorrectWithIcon() {
+        return '#ff0000';
+      },
+      defaults: {
+        WHITE: '#ffffff'
+      }
+    }
+  };
+});
+jest.mock('@mui/icons-material/Check', function () {
+  return function Check(props) {
+    return /*#__PURE__*/_react["default"].createElement("svg", {
+      "data-testid": "check-icon",
+      title: props.title,
+      className: props.className
+    });
+  };
+});
+jest.mock('@mui/icons-material/Close', function () {
+  return function Close(props) {
+    return /*#__PURE__*/_react["default"].createElement("svg", {
+      "data-testid": "close-icon",
+      title: props.title,
+      className: props.className
+    });
+  };
+});
+var theme;
+beforeAll(function () {
+  theme = (0, _styles.createTheme)();
+});
+describe('CorrectnessIndicator', function () {
+  var mockScale = {
+    x: jest.fn(function (val) {
+      return val * 10;
+    }),
+    y: jest.fn(function (val) {
+      return val * 10;
+    })
+  };
+  beforeEach(function () {
+    jest.clearAllMocks();
+  });
+  var renderComponent = function renderComponent() {
+    var extras = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    var defaults = {
+      scale: mockScale,
+      x: 5,
+      y: 10,
+      correctness: {
+        value: 'correct',
+        label: 'Correct Answer'
+      },
+      interactive: true
+    };
+    var props = _objectSpread(_objectSpread({}, defaults), extras);
+    return (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_styles.ThemeProvider, {
+      theme: theme
+    }, /*#__PURE__*/_react["default"].createElement("svg", null, /*#__PURE__*/_react["default"].createElement(_correctnessIndicators.CorrectnessIndicator, props))));
+  };
+  describe('rendering', function () {
+    it('should render without crashing', function () {
+      var _renderComponent = renderComponent(),
+        container = _renderComponent.container;
+      expect(container).toBeInTheDocument();
+    });
+    it('should render foreignObject element', function () {
+      var _renderComponent2 = renderComponent(),
+        container = _renderComponent2.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).toBeInTheDocument();
+    });
+    it('should render check icon for correct answer', function () {
+      var _renderComponent3 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: 'Correct'
+          }
+        }),
+        getByTestId = _renderComponent3.getByTestId;
+      expect(getByTestId('check-icon')).toBeInTheDocument();
+    });
+    it('should render close icon for incorrect answer', function () {
+      var _renderComponent4 = renderComponent({
+          correctness: {
+            value: 'incorrect',
+            label: 'Incorrect'
+          }
+        }),
+        getByTestId = _renderComponent4.getByTestId;
+      expect(getByTestId('close-icon')).toBeInTheDocument();
+    });
+    it('should not render when correctness is null', function () {
+      var _renderComponent5 = renderComponent({
+          correctness: null
+        }),
+        container = _renderComponent5.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).not.toBeInTheDocument();
+    });
+    it('should not render when correctness is undefined', function () {
+      var _renderComponent6 = renderComponent({
+          correctness: undefined
+        }),
+        container = _renderComponent6.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).not.toBeInTheDocument();
+    });
+    it('should not render when interactive is false', function () {
+      var _renderComponent7 = renderComponent({
+          interactive: false
+        }),
+        container = _renderComponent7.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).not.toBeInTheDocument();
+    });
+    it('should render with correct title for correct answer', function () {
+      var _renderComponent8 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: 'Well done!'
+          }
+        }),
+        getByTestId = _renderComponent8.getByTestId;
+      var icon = getByTestId('check-icon');
+      expect(icon).toHaveAttribute('title', 'Well done!');
+    });
+    it('should render with correct title for incorrect answer', function () {
+      var _renderComponent9 = renderComponent({
+          correctness: {
+            value: 'incorrect',
+            label: 'Try again'
+          }
+        }),
+        getByTestId = _renderComponent9.getByTestId;
+      var icon = getByTestId('close-icon');
+      expect(icon).toHaveAttribute('title', 'Try again');
+    });
+  });
+  describe('positioning with scale', function () {
+    it('should use scale to calculate position', function () {
+      var _renderComponent0 = renderComponent({
+          scale: mockScale,
+          x: 5,
+          y: 10
+        }),
+        container = _renderComponent0.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(mockScale.x).toHaveBeenCalledWith(5);
+      expect(mockScale.y).toHaveBeenCalledWith(10);
+      // position is scaled value - 11 (half of 22px icon size)
+      expect(foreignObject).toHaveAttribute('x', '39'); // 50 - 11
+      expect(foreignObject).toHaveAttribute('y', '89'); // 100 - 11
+    });
+    it('should have correct size attributes', function () {
+      var _renderComponent1 = renderComponent(),
+        container = _renderComponent1.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).toHaveAttribute('width', '22');
+      expect(foreignObject).toHaveAttribute('height', '22');
+    });
+    it('should handle different x and y values', function () {
+      var _renderComponent10 = renderComponent({
+          x: 20,
+          y: 30
+        }),
+        container = _renderComponent10.container;
+      expect(mockScale.x).toHaveBeenCalledWith(20);
+      expect(mockScale.y).toHaveBeenCalledWith(30);
+    });
+    it('should use raw values when scale is not provided', function () {
+      var _renderComponent11 = renderComponent({
+          scale: null,
+          x: 50,
+          y: 100
+        }),
+        container = _renderComponent11.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).toHaveAttribute('x', '39'); // 50 - 11
+      expect(foreignObject).toHaveAttribute('y', '89'); // 100 - 11
+    });
+  });
+  describe('edge cases', function () {
+    it('should handle zero coordinates', function () {
+      var _renderComponent12 = renderComponent({
+          x: 0,
+          y: 0
+        }),
+        container = _renderComponent12.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).toHaveAttribute('x', '-11');
+      expect(foreignObject).toHaveAttribute('y', '-11');
+    });
+    it('should handle negative coordinates', function () {
+      var _renderComponent13 = renderComponent({
+          x: -5,
+          y: -10
+        }),
+        container = _renderComponent13.container;
+      expect(mockScale.x).toHaveBeenCalledWith(-5);
+      expect(mockScale.y).toHaveBeenCalledWith(-10);
+    });
+    it('should handle large coordinates', function () {
+      var _renderComponent14 = renderComponent({
+          x: 1000,
+          y: 2000
+        }),
+        container = _renderComponent14.container;
+      expect(mockScale.x).toHaveBeenCalledWith(1000);
+      expect(mockScale.y).toHaveBeenCalledWith(2000);
+    });
+    it('should handle correctness with empty label', function () {
+      var _renderComponent15 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: ''
+          }
+        }),
+        getByTestId = _renderComponent15.getByTestId;
+      var icon = getByTestId('check-icon');
+      expect(icon).toHaveAttribute('title', '');
+    });
+    it('should handle correctness with undefined label', function () {
+      var _renderComponent16 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: undefined
+          }
+        }),
+        getByTestId = _renderComponent16.getByTestId;
+      expect(getByTestId('check-icon')).toBeInTheDocument();
+    });
+    it('should render when both correctness and interactive are true', function () {
+      var _renderComponent17 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: 'Test'
+          },
+          interactive: true
+        }),
+        container = _renderComponent17.container;
+      expect(container.querySelector('foreignObject')).toBeInTheDocument();
+    });
+    it('should not render when interactive is false even with correctness', function () {
+      var _renderComponent18 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: 'Test'
+          },
+          interactive: false
+        }),
+        container = _renderComponent18.container;
+      expect(container.querySelector('foreignObject')).not.toBeInTheDocument();
+    });
+  });
+});
+describe('SmallCorrectPointIndicator', function () {
+  var mockScale = {
+    x: jest.fn(function (val) {
+      return val * 10;
+    }),
+    y: jest.fn(function (val) {
+      return val * 10;
+    })
+  };
+  var correctData = [{
+    label: 'A',
+    value: 10
+  }, {
+    label: 'B',
+    value: 20
+  }, {
+    label: 'C',
+    value: '30'
+  }];
+  beforeEach(function () {
+    jest.clearAllMocks();
+  });
+  var renderComponent = function renderComponent() {
+    var extras = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    var defaults = {
+      scale: mockScale,
+      x: 5,
+      correctness: {
+        value: 'incorrect',
+        label: 'Incorrect'
+      },
+      correctData: correctData,
+      label: 'A'
+    };
+    var props = _objectSpread(_objectSpread({}, defaults), extras);
+    return (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_styles.ThemeProvider, {
+      theme: theme
+    }, /*#__PURE__*/_react["default"].createElement("svg", null, /*#__PURE__*/_react["default"].createElement(_correctnessIndicators.SmallCorrectPointIndicator, props))));
+  };
+  describe('rendering', function () {
+    it('should render without crashing', function () {
+      var _renderComponent19 = renderComponent(),
+        container = _renderComponent19.container;
+      expect(container).toBeInTheDocument();
+    });
+    it('should render foreignObject when incorrect', function () {
+      var _renderComponent20 = renderComponent({
+          correctness: {
+            value: 'incorrect',
+            label: 'Wrong'
+          },
+          label: 'A'
+        }),
+        container = _renderComponent20.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).toBeInTheDocument();
+    });
+    it('should render small check icon when incorrect', function () {
+      var _renderComponent21 = renderComponent({
+          correctness: {
+            value: 'incorrect',
+            label: 'Wrong'
+          },
+          label: 'A'
+        }),
+        getByTestId = _renderComponent21.getByTestId;
+      var icon = getByTestId('check-icon');
+      expect(icon).toBeInTheDocument();
+      expect(icon).toHaveClass('small');
+    });
+    it('should not render when correctness is correct', function () {
+      var _renderComponent22 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: 'Correct'
+          }
+        }),
+        container = _renderComponent22.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).not.toBeInTheDocument();
+    });
+    it('should not render when correctness is null', function () {
+      var _renderComponent23 = renderComponent({
+          correctness: null
+        }),
+        container = _renderComponent23.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).not.toBeInTheDocument();
+    });
+    it('should not render when correctness is undefined', function () {
+      var _renderComponent24 = renderComponent({
+          correctness: undefined
+        }),
+        container = _renderComponent24.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).not.toBeInTheDocument();
+    });
+  });
+  describe('positioning', function () {
+    it('should calculate correct position for label A', function () {
+      var _renderComponent25 = renderComponent({
+          x: 5,
+          label: 'A'
+        }),
+        container = _renderComponent25.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(mockScale.x).toHaveBeenCalledWith(5);
+      expect(mockScale.y).toHaveBeenCalledWith(10); // value from correctData for label A
+      // Position is scaled value - 7.5 (half of 15px small icon size)
+      expect(foreignObject).toHaveAttribute('x', '42.5'); // 50 - 7.5
+      expect(foreignObject).toHaveAttribute('y', '92.5'); // 100 - 7.5
+    });
+    it('should calculate correct position for label B', function () {
+      var _renderComponent26 = renderComponent({
+          x: 5,
+          label: 'B'
+        }),
+        container = _renderComponent26.container;
+      expect(mockScale.y).toHaveBeenCalledWith(20);
+    });
+    it('should calculate correct position for label C with string value', function () {
+      var _renderComponent27 = renderComponent({
+          x: 5,
+          label: 'C'
+        }),
+        container = _renderComponent27.container;
+      expect(mockScale.y).toHaveBeenCalledWith(30);
+    });
+    it('should have correct size attributes for small icon', function () {
+      var _renderComponent28 = renderComponent({
+          label: 'A'
+        }),
+        container = _renderComponent28.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).toHaveAttribute('width', '15');
+      expect(foreignObject).toHaveAttribute('height', '15');
+    });
+  });
+  describe('correctData handling', function () {
+    it('should find correct value from correctData by label', function () {
+      var _renderComponent29 = renderComponent({
+          label: 'B'
+        }),
+        container = _renderComponent29.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).toBeInTheDocument();
+      expect(mockScale.y).toHaveBeenCalledWith(20);
+    });
+    it('should not render when label is not in correctData', function () {
+      var _renderComponent30 = renderComponent({
+          label: 'Z'
+        }),
+        container = _renderComponent30.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).not.toBeInTheDocument();
+    });
+    it('should not render when correctData value is NaN', function () {
+      var _renderComponent31 = renderComponent({
+          correctData: [{
+            label: 'A',
+            value: 'invalid'
+          }],
+          label: 'A'
+        }),
+        container = _renderComponent31.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).not.toBeInTheDocument();
+    });
+    it('should handle empty correctData array', function () {
+      var _renderComponent32 = renderComponent({
+          correctData: [],
+          label: 'A'
+        }),
+        container = _renderComponent32.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).not.toBeInTheDocument();
+    });
+    it('should not render when correctData is undefined (correctness not incorrect)', function () {
+      var _renderComponent33 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: 'Correct'
+          },
+          correctData: undefined,
+          label: 'A'
+        }),
+        container = _renderComponent33.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).not.toBeInTheDocument();
+    });
+    it('should parse string values correctly', function () {
+      var _renderComponent34 = renderComponent({
+          correctData: [{
+            label: 'D',
+            value: '45.5'
+          }],
+          label: 'D'
+        }),
+        container = _renderComponent34.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).toBeInTheDocument();
+      expect(mockScale.y).toHaveBeenCalledWith(45.5);
+    });
+    it('should handle zero values', function () {
+      var _renderComponent35 = renderComponent({
+          correctData: [{
+            label: 'E',
+            value: 0
+          }],
+          label: 'E'
+        }),
+        container = _renderComponent35.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).toBeInTheDocument();
+      expect(mockScale.y).toHaveBeenCalledWith(0);
+    });
+    it('should handle negative values', function () {
+      var _renderComponent36 = renderComponent({
+          correctData: [{
+            label: 'F',
+            value: -10
+          }],
+          label: 'F'
+        }),
+        container = _renderComponent36.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).toBeInTheDocument();
+      expect(mockScale.y).toHaveBeenCalledWith(-10);
+    });
+  });
+  describe('icon properties', function () {
+    it('should render icon with correct title', function () {
+      var _renderComponent37 = renderComponent({
+          correctness: {
+            value: 'incorrect',
+            label: 'Not quite right'
+          },
+          label: 'A'
+        }),
+        getByTestId = _renderComponent37.getByTestId;
+      var icon = getByTestId('check-icon');
+      expect(icon).toHaveAttribute('title', 'Not quite right');
+    });
+    it('should render icon with small className', function () {
+      var _renderComponent38 = renderComponent({
+          label: 'A'
+        }),
+        getByTestId = _renderComponent38.getByTestId;
+      var icon = getByTestId('check-icon');
+      expect(icon).toHaveClass('small');
+    });
+  });
+  describe('edge cases', function () {
+    it('should handle missing label prop', function () {
+      var _renderComponent39 = renderComponent({
+          label: undefined
+        }),
+        container = _renderComponent39.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).not.toBeInTheDocument();
+    });
+    it('should handle empty string label', function () {
+      var _renderComponent40 = renderComponent({
+          label: ''
+        }),
+        container = _renderComponent40.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).not.toBeInTheDocument();
+    });
+    it('should handle very large values in correctData', function () {
+      var _renderComponent41 = renderComponent({
+          correctData: [{
+            label: 'G',
+            value: 999999
+          }],
+          label: 'G'
+        }),
+        container = _renderComponent41.container;
+      var foreignObject = container.querySelector('foreignObject');
+      expect(foreignObject).toBeInTheDocument();
+      expect(mockScale.y).toHaveBeenCalledWith(999999);
+    });
+    it('should only render for incorrect answers', function () {
+      var _renderComponent42 = renderComponent({
+          correctness: {
+            value: 'incorrect',
+            label: 'Wrong'
+          },
+          label: 'A'
+        }),
+        incorrectContainer = _renderComponent42.container;
+      expect(incorrectContainer.querySelector('foreignObject')).toBeInTheDocument();
+      var _renderComponent43 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: 'Right'
+          },
+          label: 'A'
+        }),
+        correctContainer = _renderComponent43.container;
+      expect(correctContainer.querySelector('foreignObject')).not.toBeInTheDocument();
+    });
+  });
+});
+describe('TickCorrectnessIndicator', function () {
+  beforeEach(function () {
+    jest.clearAllMocks();
+  });
+  var renderComponent = function renderComponent() {
+    var extras = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    var defaults = {
+      correctness: {
+        value: 'correct',
+        label: 'Correct Answer'
+      },
+      interactive: true
+    };
+    var props = _objectSpread(_objectSpread({}, defaults), extras);
+    return (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_styles.ThemeProvider, {
+      theme: theme
+    }, /*#__PURE__*/_react["default"].createElement(_correctnessIndicators.TickCorrectnessIndicator, props)));
+  };
+  describe('rendering', function () {
+    it('should render without crashing', function () {
+      var _renderComponent44 = renderComponent(),
+        container = _renderComponent44.container;
+      expect(container).toBeInTheDocument();
+    });
+    it('should render check icon for correct answer', function () {
+      var _renderComponent45 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: 'Correct'
+          }
+        }),
+        getByTestId = _renderComponent45.getByTestId;
+      expect(getByTestId('check-icon')).toBeInTheDocument();
+    });
+    it('should render close icon for incorrect answer', function () {
+      var _renderComponent46 = renderComponent({
+          correctness: {
+            value: 'incorrect',
+            label: 'Incorrect'
+          }
+        }),
+        getByTestId = _renderComponent46.getByTestId;
+      expect(getByTestId('close-icon')).toBeInTheDocument();
+    });
+    it('should not render when correctness is null', function () {
+      var _renderComponent47 = renderComponent({
+          correctness: null
+        }),
+        queryByTestId = _renderComponent47.queryByTestId;
+      expect(queryByTestId('check-icon')).not.toBeInTheDocument();
+      expect(queryByTestId('close-icon')).not.toBeInTheDocument();
+    });
+    it('should not render when correctness is undefined', function () {
+      var _renderComponent48 = renderComponent({
+          correctness: undefined
+        }),
+        queryByTestId = _renderComponent48.queryByTestId;
+      expect(queryByTestId('check-icon')).not.toBeInTheDocument();
+      expect(queryByTestId('close-icon')).not.toBeInTheDocument();
+    });
+    it('should not render when interactive is false', function () {
+      var _renderComponent49 = renderComponent({
+          interactive: false
+        }),
+        queryByTestId = _renderComponent49.queryByTestId;
+      expect(queryByTestId('check-icon')).not.toBeInTheDocument();
+      expect(queryByTestId('close-icon')).not.toBeInTheDocument();
+    });
+    it('should render with correct title for correct answer', function () {
+      var _renderComponent50 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: 'Great job!'
+          }
+        }),
+        getByTestId = _renderComponent50.getByTestId;
+      var icon = getByTestId('check-icon');
+      expect(icon).toHaveAttribute('title', 'Great job!');
+    });
+    it('should render with correct title for incorrect answer', function () {
+      var _renderComponent51 = renderComponent({
+          correctness: {
+            value: 'incorrect',
+            label: 'Not correct'
+          }
+        }),
+        getByTestId = _renderComponent51.getByTestId;
+      var icon = getByTestId('close-icon');
+      expect(icon).toHaveAttribute('title', 'Not correct');
+    });
+  });
+  describe('interactive flag', function () {
+    it('should render when interactive is true', function () {
+      var _renderComponent52 = renderComponent({
+          interactive: true,
+          correctness: {
+            value: 'correct',
+            label: 'Test'
+          }
+        }),
+        getByTestId = _renderComponent52.getByTestId;
+      expect(getByTestId('check-icon')).toBeInTheDocument();
+    });
+    it('should not render when interactive is false', function () {
+      var _renderComponent53 = renderComponent({
+          interactive: false,
+          correctness: {
+            value: 'correct',
+            label: 'Test'
+          }
+        }),
+        queryByTestId = _renderComponent53.queryByTestId;
+      expect(queryByTestId('check-icon')).not.toBeInTheDocument();
+    });
+    it('should not render when interactive is undefined', function () {
+      var _renderComponent54 = renderComponent({
+          interactive: undefined,
+          correctness: {
+            value: 'correct',
+            label: 'Test'
+          }
+        }),
+        queryByTestId = _renderComponent54.queryByTestId;
+      expect(queryByTestId('check-icon')).not.toBeInTheDocument();
+    });
+    it('should not render when interactive is null', function () {
+      var _renderComponent55 = renderComponent({
+          interactive: null,
+          correctness: {
+            value: 'correct',
+            label: 'Test'
+          }
+        }),
+        queryByTestId = _renderComponent55.queryByTestId;
+      expect(queryByTestId('check-icon')).not.toBeInTheDocument();
+    });
+  });
+  describe('correctness values', function () {
+    it('should render check icon when value is "correct"', function () {
+      var _renderComponent56 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: 'Test'
+          }
+        }),
+        getByTestId = _renderComponent56.getByTestId,
+        queryByTestId = _renderComponent56.queryByTestId;
+      expect(getByTestId('check-icon')).toBeInTheDocument();
+      expect(queryByTestId('close-icon')).not.toBeInTheDocument();
+    });
+    it('should render close icon when value is "incorrect"', function () {
+      var _renderComponent57 = renderComponent({
+          correctness: {
+            value: 'incorrect',
+            label: 'Test'
+          }
+        }),
+        getByTestId = _renderComponent57.getByTestId,
+        queryByTestId = _renderComponent57.queryByTestId;
+      expect(getByTestId('close-icon')).toBeInTheDocument();
+      expect(queryByTestId('check-icon')).not.toBeInTheDocument();
+    });
+    it('should render close icon for any value other than "correct"', function () {
+      var _renderComponent58 = renderComponent({
+          correctness: {
+            value: 'partial',
+            label: 'Test'
+          }
+        }),
+        getByTestId = _renderComponent58.getByTestId;
+      expect(getByTestId('close-icon')).toBeInTheDocument();
+    });
+    it('should handle empty value string', function () {
+      var _renderComponent59 = renderComponent({
+          correctness: {
+            value: '',
+            label: 'Test'
+          }
+        }),
+        getByTestId = _renderComponent59.getByTestId;
+      expect(getByTestId('close-icon')).toBeInTheDocument();
+    });
+  });
+  describe('edge cases', function () {
+    it('should handle correctness with empty label', function () {
+      var _renderComponent60 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: ''
+          }
+        }),
+        getByTestId = _renderComponent60.getByTestId;
+      var icon = getByTestId('check-icon');
+      expect(icon).toHaveAttribute('title', '');
+    });
+    it('should handle correctness with undefined label', function () {
+      var _renderComponent61 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: undefined
+          }
+        }),
+        getByTestId = _renderComponent61.getByTestId;
+      expect(getByTestId('check-icon')).toBeInTheDocument();
+    });
+    it('should handle correctness with null value', function () {
+      var _renderComponent62 = renderComponent({
+          correctness: {
+            value: null,
+            label: 'Test'
+          }
+        }),
+        queryByTestId = _renderComponent62.queryByTestId;
+      expect(queryByTestId('close-icon')).toBeInTheDocument();
+    });
+    it('should require both correctness and interactive to render', function () {
+      var _renderComponent63 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: 'Test'
+          },
+          interactive: false
+        }),
+        query1 = _renderComponent63.queryByTestId;
+      expect(query1('check-icon')).not.toBeInTheDocument();
+      var _renderComponent64 = renderComponent({
+          correctness: null,
+          interactive: true
+        }),
+        query2 = _renderComponent64.queryByTestId;
+      expect(query2('check-icon')).not.toBeInTheDocument();
+    });
+    it('should handle special characters in label', function () {
+      var _renderComponent65 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: 'Test <>&"'
+          }
+        }),
+        getByTestId = _renderComponent65.getByTestId;
+      var icon = getByTestId('check-icon');
+      expect(icon).toHaveAttribute('title', 'Test <>&"');
+    });
+    it('should handle unicode characters in label', function () {
+      var _renderComponent66 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: 'Test 你好 🎉'
+          }
+        }),
+        getByTestId = _renderComponent66.getByTestId;
+      var icon = getByTestId('check-icon');
+      expect(icon).toHaveAttribute('title', 'Test 你好 🎉');
+    });
+    it('should handle very long labels', function () {
+      var longLabel = 'This is a very long label that might cause layout issues in the UI';
+      var _renderComponent67 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: longLabel
+          }
+        }),
+        getByTestId = _renderComponent67.getByTestId;
+      var icon = getByTestId('check-icon');
+      expect(icon).toHaveAttribute('title', longLabel);
+    });
+  });
+  describe('component consistency', function () {
+    it('should render same icon type consistently for same correctness value', function () {
+      var _renderComponent68 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: 'Test 1'
+          }
+        }),
+        getByTestId = _renderComponent68.getByTestId,
+        unmount = _renderComponent68.unmount;
+      expect(getByTestId('check-icon')).toBeInTheDocument();
+      unmount();
+      var _renderComponent69 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: 'Test 2'
+          }
+        }),
+        get2 = _renderComponent69.getByTestId;
+      expect(get2('check-icon')).toBeInTheDocument();
+    });
+    it('should render different icons for different correctness values', function () {
+      var _renderComponent70 = renderComponent({
+          correctness: {
+            value: 'correct',
+            label: 'Correct'
+          }
+        }),
+        getByTestId = _renderComponent70.getByTestId,
+        unmount = _renderComponent70.unmount;
+      expect(getByTestId('check-icon')).toBeInTheDocument();
+      unmount();
+      var _renderComponent71 = renderComponent({
+          correctness: {
+            value: 'incorrect',
+            label: 'Incorrect'
+          }
+        }),
+        get2 = _renderComponent71.getByTestId;
+      expect(get2('close-icon')).toBeInTheDocument();
+    });
+  });
+});
+//# sourceMappingURL=correctness-indicators.test.js.map