Merge 5202dd6 into e05504d

Khan · Mar 24, 2023 · 820fbdb · 820fbdb
2 parents e05504d + 5202dd6
commit 820fbdb
Show file tree

Hide file tree

Showing 9 changed files with 141 additions and 494 deletions.
diff --git a/.changeset/hungry-llamas-leave.md b/.changeset/hungry-llamas-leave.md
@@ -0,0 +1,5 @@
+---
+"@khanacademy/perseus": minor
+---
+
+Configure Perseus to render numeric-input widgets in place of input-number
diff --git a/packages/perseus/src/index.js b/packages/perseus/src/index.js
@@ -125,6 +125,7 @@ export type {ParsedValue} from "./util.js";
 export type {
     MathFormat,
     InputNumberWidget,
+    NumericInputWidget,
     PerseusRadioWidgetOptions,
     PerseusRenderer,
 } from "./perseus-types.js";

diff --git a/packages/perseus/src/perseus-types.js b/packages/perseus/src/perseus-types.js
@@ -725,8 +725,9 @@ export type PerseusNumericInputWidgetOptions = {|
     answers: $ReadOnlyArray<PerseusNumericInputAnswer>,
     // Translatable Text; Text to describe this input. This will be shown to users using screenreaders.
     labelText: string,
-    // Use size "Normal" for all text boxes, unless there are multiple text boxes in one line and the answer area is too narrow to fit them. Options: "normal" or "small"
-    size: string,
+    // Use size "Normal" for all text boxes, unless there are multiple text boxes in one line and the answer area is too narrow to fit them.
+    // Options: "normal" or "small"
+    size: "normal" | "small",
     // A coefficient style number allows the student to use - for -1 and an empty string to mean 1.
     coefficient: boolean,
     // Whether we're asking for all correct solutions or only one
@@ -750,16 +751,18 @@ export type PerseusNumericInputAnswer = {|
     value: number,
     // Whether this answer is "correct", "wrong", or "ungraded"
     status: string,
-    // The forms available for this answer.  Options: "integer, ""decimal", "proper", "improper", "mixed", or "pi"
+    // The forms available for this answer.
+    // Options: "integer, ""decimal", "proper", "improper", "mixed", or "pi"
     // NOTE: perseus_data.go says this is required even though it isn't necessary.
     answerForms?: $ReadOnlyArray<MathFormat>,
     // Whether the answerForms should be strictly matched
     strict: boolean,
     // A range of error +/- the value
     // NOTE: perseus_data.go says this is non-nullable even though we handle null values.
     maxError: ?number,
-    // Unsimplified answers are Ungraded, Accepted, or Wrong. Options: "required", "correct", or "enforced"
-    simplify: ?string,
+    // Unsimplified answers are Ungraded, Accepted, or Wrong.
+    // Options: "required", "correct", or "enforced"
+    simplify: ?("required" | "optional" | "enforced"),
 |};
 
 export type PerseusNumberLineWidgetOptions = {|

diff --git a/packages/perseus/src/types.js b/packages/perseus/src/types.js
@@ -437,7 +437,19 @@ export type WidgetExports<
     tracking?: Tracking,
     staticTransform?: WidgetTransform, // this is a function of some sort
     traverseChildWidgets?: $FlowFixMe, // (Props, traverseRenderer) => NewProps
-    propUpgrades?: {|[string]: ($FlowFixMe) => $FlowFixMe|}, // OldProps => NewProps
+    // propUpgrades is a map! The key is the _target_ major version as a string
+    // (so '1' for major version 1). THe value is a transform function that
+    // takes the props from the previous version and migrates them to target
+    // version-compatible props. See the radio.jsx widget for an example.
+    // Minor version upgrades are not represented here. Instead, the upgrade
+    // machinery fills in any new props in a minor version with their default
+    // value as defined by the editor widget's `defaultProps` value for each
+    // widget.
+    propUpgrades?: {|
+        [targetMajorVersion: string]: (
+            previousMajorVersionProps: $FlowFixMe,
+        ) => $FlowFixMe,
+    |}, // OldProps => NewProps
     widget: T,
 |}>;
 

diff --git a/packages/perseus/src/widgets/__stories__/numeric-input.stories.jsx b/packages/perseus/src/widgets/__stories__/numeric-input.stories.jsx
@@ -25,7 +25,7 @@ function generateProps(overwrite) {
         reviewModeRubric: {
             answers: [],
             labelText: "",
-            size: "medium",
+            size: "normal",
             coefficient: false,
             static: false,
         },

diff --git a/packages/perseus/src/widgets/__tests__/input-number_test.jsx b/packages/perseus/src/widgets/__tests__/input-number_test.jsx
@@ -9,22 +9,10 @@ import _ from "underscore";
 
 import {testDependencies} from "../../../../../testing/test-dependencies.js";
 import * as Dependencies from "../../dependencies.js";
-import {errors} from "../../util/answer-types.js";
 import {question3 as question} from "../__testdata__/input-number_testdata.js";
-import InputNumber from "../input-number.jsx";
 
 import {renderQuestion} from "./renderQuestion.jsx";
 
-import type {PerseusInputNumberWidgetOptions} from "../../perseus-types.js";
-
-const {transform} = InputNumber;
-
-const options: PerseusInputNumberWidgetOptions = {
-    value: "2^{-2}-3",
-    size: "normal",
-    simplify: "optional",
-};
-
 describe("input-number", function () {
     beforeEach(() => {
         jest.spyOn(Dependencies, "getDependencies").mockReturnValue(
@@ -205,87 +193,6 @@ describe("input-number", function () {
             expect(renderer).toHaveBeenAnsweredIncorrectly();
         });
     });
-
-    it("transform should remove the `value` field", function () {
-        const editorProps = {
-            value: 5,
-            simplify: "required",
-            size: "normal",
-            inexact: false,
-            maxError: 0.1,
-            answerType: "number",
-        };
-        if (!transform) {
-            throw new Error("transform not defined");
-        }
-        const widgetProps = transform(editorProps);
-        expect(_.has(widgetProps, "value")).toBe(false);
-    });
-});
-
-describe("invalid", function () {
-    beforeEach(() => {
-        jest.spyOn(Dependencies, "getDependencies").mockReturnValue(
-            testDependencies,
-        );
-    });
-
-    it("should handle invalid answers with no error callback", function () {
-        const err = InputNumber.widget.validate({currentValue: "x+1"}, options);
-        expect(err).toStrictEqual({
-            message: errors.EXTRA_SYMBOLS_ERROR,
-            type: "invalid",
-        });
-    });
-});
-
-describe("getOneCorrectAnswerFromRubric", () => {
-    beforeEach(() => {
-        jest.spyOn(Dependencies, "getDependencies").mockReturnValue(
-            testDependencies,
-        );
-    });
-
-    it("should return undefined if rubric.value is null/undefined", () => {
-        // Arrange
-        const rubric = {};
-
-        // Act
-        const result = InputNumber.widget.getOneCorrectAnswerFromRubric(rubric);
-
-        // Assert
-        expect(result).toBeUndefined();
-    });
-
-    it("should return rubric.value if inexact is false", () => {
-        // Arrange
-        const rubric = {
-            value: 0,
-            maxError: 0.1,
-            inexact: false,
-        };
-
-        // Act
-        const result = InputNumber.widget.getOneCorrectAnswerFromRubric(rubric);
-
-        // Assert
-        expect(result).toEqual("0");
-    });
-
-    it("should return rubric.value with an error band if inexact is true", () => {
-        // Arrange
-        const rubric = {
-            value: 0,
-            maxError: 0.1,
-            inexact: true,
-        };
-
-        // Act
-        const result = InputNumber.widget.getOneCorrectAnswerFromRubric(rubric);
-
-        // Assert
-        expect(result).toEqual("0 ± 0.1");
-    });
 });
 
 describe("rendering", () => {

diff --git a/packages/perseus/src/widgets/__tests__/numeric-input_test.jsx b/packages/perseus/src/widgets/__tests__/numeric-input_test.jsx
@@ -84,7 +84,7 @@ describe("static function getOneCorrectAnswerFromRubric", () => {
         const singleAnswer = NumericInput.getOneCorrectAnswerFromRubric({
             answers,
             labelText: "",
-            size: "medium",
+            size: "normal",
             static: false,
             coefficient: false,
         });
@@ -99,7 +99,7 @@ describe("static function getOneCorrectAnswerFromRubric", () => {
         const singleAnswer = NumericInput.getOneCorrectAnswerFromRubric({
             answers,
             labelText: "",
-            size: "medium",
+            size: "normal",
             static: false,
             coefficient: false,
         });
@@ -111,7 +111,7 @@ describe("static function getOneCorrectAnswerFromRubric", () => {
         const singleAnswer = NumericInput.getOneCorrectAnswerFromRubric({
             answers,
             labelText: "",
-            size: "medium",
+            size: "normal",
             static: false,
             coefficient: false,
         });
@@ -126,7 +126,7 @@ describe("static function getOneCorrectAnswerFromRubric", () => {
                     value: 1.0,
                     maxError: 0.2,
                     answerForms: ["decimal"],
-                    simplify: "",
+                    simplify: "required",
                     strict: false,
                     message: "",
                 },
@@ -155,7 +155,7 @@ describe("static function validate", () => {
                     value: 1,
                     status: "correct",
                     maxError: 0,
-                    simplify: "",
+                    simplify: "required",
                     strict: false,
                     message: "",
                 },
@@ -189,7 +189,7 @@ describe("static function validate", () => {
                     value: 1,
                     status: "correct",
                     maxError: 0,
-                    simplify: "",
+                    simplify: "required",
                     strict: false,
                     message: "",
                 },
@@ -221,7 +221,7 @@ describe("static function validate", () => {
                     value: 1,
                     status: "correct",
                     maxError: 0,
-                    simplify: "",
+                    simplify: "required",
                     strict: true,
                     message: "",
                 },
@@ -255,7 +255,7 @@ describe("static function validate", () => {
                     value: 1,
                     status: "correct",
                     maxError: 0.2,
-                    simplify: "",
+                    simplify: "required",
                     strict: true,
                     message: "",
                 },
@@ -289,7 +289,7 @@ describe("static function validate", () => {
                     value: 1,
                     status: "correct",
                     maxError: 0.2,
-                    simplify: "",
+                    simplify: "required",
                     strict: true,
                     message: "",
                 },