diff --git a/.changeset/orange-wombats-destroy.md b/.changeset/orange-wombats-destroy.md new file mode 100644 index 0000000000..fb2f09445b --- /dev/null +++ b/.changeset/orange-wombats-destroy.md @@ -0,0 +1,5 @@ +--- +"@khanacademy/perseus": major +--- + +Remove deprecated/unused `examples()` function from `Renderer` diff --git a/packages/perseus/src/__tests__/renderer.test.tsx b/packages/perseus/src/__tests__/renderer.test.tsx index 04892d6eb0..fccdbddebb 100644 --- a/packages/perseus/src/__tests__/renderer.test.tsx +++ b/packages/perseus/src/__tests__/renderer.test.tsx @@ -1793,72 +1793,4 @@ describe("renderer", () => { expect(Object.keys(json.widgets)).toEqual(widgetKeys); }); }); - - describe("examples", () => { - it("should return examples if all widgets return the same examples (or null)", () => { - // Arrange - const {renderer} = renderQuestion({ - content: - "Input widget: [[\u2603 input-number 1]]\n\n" + - "Dropdown widget: [[\u2603 dropdown 1]]\n\n" + - "Image widget (won't have user input): [[\u2603 image 1]]\n\n" + - "Another input widget: [[\u2603 input-number 2]]", - widgets: { - "image 1": imageWidget, - "input-number 1": inputNumberWidget, - "input-number 2": inputNumberWidget, - "dropdown 1": dropdownWidget, - }, - images: {}, - }); - - // Act - const examples = renderer.examples(); - - // Assert - expect(examples).toMatchInlineSnapshot(` - [ - "**Your answer should be** ", - "an integer, like $6$", - "a *proper* fraction, like $1/2$ or $6/10$", - "an *improper* fraction, like $10/7$ or $14/8$", - "a mixed number, like $1\\ 3/4$", - ] - `); - }); - - it("should return nothing if widgets return the different examples", () => { - // NOTE(jeremy): I'm unsure why we don't return examples if the - // examples aren't the same, but this is current functionality so - // I'm adding this test to verify the current behaviour. - - // Arrange - const {renderer} = renderQuestion({ - content: - "Input widget: [[\u2603 input-number 1]]\n\n" + - "Dropdown widget: [[\u2603 dropdown 1]]\n\n" + - "Image widget (won't have user input): [[\u2603 image 1]]\n\n" + - "Another input widget: [[\u2603 input-number 2]]", - widgets: { - "image 1": imageWidget, - "input-number 1": inputNumberWidget, - "input-number 2": { - ...inputNumberWidget, - options: { - ...inputNumberWidget.options, - answerType: "percent", - }, - }, - "dropdown 1": dropdownWidget, - }, - images: {}, - }); - - // Act - const examples = renderer.examples(); - - // Assert - expect(examples).toBeNull(); - }); - }); }); diff --git a/packages/perseus/src/renderer.tsx b/packages/perseus/src/renderer.tsx index 95720579c9..1d99c5c7e8 100644 --- a/packages/perseus/src/renderer.tsx +++ b/packages/perseus/src/renderer.tsx @@ -1751,35 +1751,6 @@ class Renderer return [totalGuess, totalScore]; }; - examples: () => ReadonlyArray | null | undefined = () => { - const widgetIds = this.widgetIds; - const examples = widgetIds - .map((widgetId) => { - const widget = this.getWidgetInstance(widgetId); - return widget != null && widget.examples - ? widget.examples() - : null; - }) - .filter(Boolean); - - // no widgets with examples - if (!examples.length) { - return null; - } - - const allEqual = _.all(examples, function (example) { - return _.isEqual(examples[0], example); - }); - - // some widgets have different examples - // TODO(alex): handle this better - if (!allEqual) { - return null; - } - - return examples[0]; - }; - // TranslationLinter callback handletranslationLintErrors: (lintErrors: ReadonlyArray) => void = ( lintErrors: ReadonlyArray, diff --git a/packages/perseus/src/types.ts b/packages/perseus/src/types.ts index 41e4514cdd..7ba9d2d385 100644 --- a/packages/perseus/src/types.ts +++ b/packages/perseus/src/types.ts @@ -90,7 +90,6 @@ export interface Widget { getUserInput?: () => UserInputArray | UserInput | undefined; showRationalesForCurrentlySelectedChoices?: (options?: any) => void; - examples?: () => ReadonlyArray; getPromptJSON?: () => WidgetPromptJSON; } diff --git a/packages/perseus/src/widgets/input-number/input-number.tsx b/packages/perseus/src/widgets/input-number/input-number.tsx index fe0d31a5c1..12ac2ab6fe 100644 --- a/packages/perseus/src/widgets/input-number/input-number.tsx +++ b/packages/perseus/src/widgets/input-number/input-number.tsx @@ -175,7 +175,7 @@ class InputNumber extends React.Component implements Widget { return _getPromptJSON(this.props, this.getUserInput()); } - examples: () => ReadonlyArray = () => { + examples(): ReadonlyArray { const {strings} = this.context; const type = this.props.answerType; const forms = answerTypes[type].forms.split(/\s*,\s*/); @@ -185,7 +185,7 @@ class InputNumber extends React.Component implements Widget { ); return [strings.yourAnswer].concat(examples); - }; + } render(): React.ReactNode { if (this.props.apiOptions.customKeypad) { diff --git a/packages/perseus/src/widgets/numeric-input/numeric-input.tsx b/packages/perseus/src/widgets/numeric-input/numeric-input.tsx index b138a9b7d2..bd8bf29dc6 100644 --- a/packages/perseus/src/widgets/numeric-input/numeric-input.tsx +++ b/packages/perseus/src/widgets/numeric-input/numeric-input.tsx @@ -123,8 +123,11 @@ export class NumericInput isFocused: false, }; - // TODO(Nicole, Jeremy): This is maybe never used and should be removed - examples: () => ReadonlyArray = () => { + /** + * Generates a string that demonstrates how to input the various supported + * answer forms. + */ + examples(): ReadonlyArray { // if the set of specified forms are empty, allow all forms const forms = this.props.answerForms?.length !== 0 @@ -144,7 +147,7 @@ export class NumericInput examples = _.uniq(examples); return [this.context.strings.yourAnswer].concat(examples); - }; + } shouldShowExamples: () => boolean = () => { const noFormsAccepted = this.props.answerForms?.length === 0;