diff --git a/packages/perseus/src/strings.ts b/packages/perseus/src/strings.ts index d4bde80844..65aa84c3f6 100644 --- a/packages/perseus/src/strings.ts +++ b/packages/perseus/src/strings.ts @@ -283,19 +283,6 @@ export type PerseusStrings = { x: string; y: string; }): string; - srLinearSystemGrabHandle: ({ - lineNumber, - point1X, - point1Y, - point2X, - point2Y, - }: { - lineNumber: number; - point1X: string; - point1Y: string; - point2X: string; - point2Y: string; - }) => string; srRayGraph: string; srRayPoints: ({ point1X, @@ -546,15 +533,13 @@ export const strings: { "Line %(lineNumber)s has two points, point 1 at %(point1X)s comma %(point1Y)s and point 2 at %(point2X)s comma %(point2Y)s.", srLinearSystemPoint: "Point %(pointSequence)s on line %(lineNumber)s at %(x)s comma %(y)s.", - srLinearSystemGrabHandle: - "Line %(lineNumber)s from %(point1X)s comma %(point1Y)s to %(point2X)s comma %(point2Y)s.", srRayGraph: "A ray on a coordinate plane.", srRayPoints: - "The endpoint is at %(point1X)s comma %(point1Y)s and the terminal point is at %(point2X)s comma %(point2Y)s.", + "The endpoint is at %(point1X)s comma %(point1Y)s and the ray goes through point %(point2X)s comma %(point2Y)s.", srRayGrabHandle: - "Ray from endpoint %(point1X)s comma %(point1Y)s to terminal point %(point2X)s comma %(point2Y)s.", + "Ray with endpoint %(point1X)s comma %(point1Y)s going through point %(point2X)s comma %(point2Y)s.", srRayEndpoint: "Endpoint at %(point1X)s comma %(point1Y)s.", - srRayTerminalPoint: "Terminal point at %(point2X)s comma %(point2Y)s.", + srRayTerminalPoint: "Through point at %(point2X)s comma %(point2Y)s.", // The above strings are used for interactive graph SR descriptions. }; @@ -777,20 +762,12 @@ export const mockStrings: PerseusStrings = { `Line ${lineNumber} has two points, point 1 at ${point1X} comma ${point1Y} and point 2 at ${point2X} comma ${point2Y}.`, srLinearSystemPoint: ({lineNumber, pointSequence, x, y}) => `Point ${pointSequence} on line ${lineNumber} at ${x} comma ${y}.`, - srLinearSystemGrabHandle: ({ - lineNumber, - point1X, - point1Y, - point2X, - point2Y, - }) => - `Line ${lineNumber} from ${point1X} comma ${point1Y} to ${point2X} comma ${point2Y}.`, srRayGraph: "A ray on a coordinate plane.", srRayPoints: ({point1X, point1Y, point2X, point2Y}) => - `The endpoint is at ${point1X} comma ${point1Y} and the terminal point is at ${point2X} comma ${point2Y}.`, + `The endpoint is at ${point1X} comma ${point1Y} and the ray goes through point ${point2X} comma ${point2Y}.`, srRayGrabHandle: ({point1X, point1Y, point2X, point2Y}) => - `Ray from endpoint ${point1X} comma ${point1Y} to terminal point ${point2X} comma ${point2Y}.`, + `Ray with endpoint ${point1X} comma ${point1Y} going through point ${point2X} comma ${point2Y}.`, srRayEndpoint: ({x, y}) => `Endpoint at ${x} comma ${y}.`, - srRayTerminalPoint: ({x, y}) => `Terminal point at ${x} comma ${y}.`, + srRayTerminalPoint: ({x, y}) => `Through point at ${x} comma ${y}.`, // The above strings are used for interactive graph SR descriptions. }; diff --git a/packages/perseus/src/widgets/interactive-graphs/graphs/linear-system.test.tsx b/packages/perseus/src/widgets/interactive-graphs/graphs/linear-system.test.tsx index 2bfe75efed..2bda019d36 100644 --- a/packages/perseus/src/widgets/interactive-graphs/graphs/linear-system.test.tsx +++ b/packages/perseus/src/widgets/interactive-graphs/graphs/linear-system.test.tsx @@ -177,7 +177,7 @@ describe("Linear System graph screen reader", () => { ); expect(grabHandle).toHaveAttribute( "aria-label", - `Line ${lineNumber} from -2 comma 3 to 3 comma 3.`, + `The line crosses the Y-axis at 0 comma 3. Its slope is zero.`, ); expect(point2).toHaveAttribute( "aria-label", diff --git a/packages/perseus/src/widgets/interactive-graphs/graphs/linear-system.tsx b/packages/perseus/src/widgets/interactive-graphs/graphs/linear-system.tsx index 31325c54c6..d6a38cf885 100644 --- a/packages/perseus/src/widgets/interactive-graphs/graphs/linear-system.tsx +++ b/packages/perseus/src/widgets/interactive-graphs/graphs/linear-system.tsx @@ -90,13 +90,7 @@ const LinearSystemGraph = (props: LinearSystemGraphProps) => { x: srFormatNumber(line[1][0], locale), y: srFormatNumber(line[1][1], locale), }), - grabHandleAriaLabel: strings.srLinearSystemGrabHandle({ - lineNumber: i + 1, - point1X: srFormatNumber(line[0][0], locale), - point1Y: srFormatNumber(line[0][1], locale), - point2X: srFormatNumber(line[1][0], locale), - point2Y: srFormatNumber(line[1][1], locale), - }), + grabHandleAriaLabel: `${linesAriaInfo[i].interceptDescription} ${linesAriaInfo[i].slopeDescription}`, }} ariaDescribedBy={`${linesAriaInfo[i].interceptDescriptionId} ${linesAriaInfo[i].slopeDescriptionId}`} onMoveLine={(delta: vec.Vector2) => { diff --git a/packages/perseus/src/widgets/interactive-graphs/graphs/ray.test.tsx b/packages/perseus/src/widgets/interactive-graphs/graphs/ray.test.tsx index aafb0eaa19..f87795306f 100644 --- a/packages/perseus/src/widgets/interactive-graphs/graphs/ray.test.tsx +++ b/packages/perseus/src/widgets/interactive-graphs/graphs/ray.test.tsx @@ -54,15 +54,15 @@ describe("Linear graph screen reader", () => { // Assert expect(linearGraph).toBeInTheDocument(); expect(linearGraph).toHaveAccessibleDescription( - "The endpoint is at -5 comma 5 and the terminal point is at 5 comma 5.", + "The endpoint is at -5 comma 5 and the ray goes through point 5 comma 5.", ); }); test.each` element | index | expectedValue ${"point1"} | ${0} | ${"Endpoint at -5 comma 5."} - ${"grabHandle"} | ${1} | ${"Ray from endpoint -5 comma 5 to terminal point 5 comma 5."} - ${"point2"} | ${2} | ${"Terminal point at 5 comma 5."} + ${"grabHandle"} | ${1} | ${"Ray with endpoint -5 comma 5 going through point 5 comma 5."} + ${"point2"} | ${2} | ${"Through point at 5 comma 5."} `( "should have aria label for $element on the line", ({index, expectedValue}) => { @@ -88,7 +88,7 @@ describe("Linear graph screen reader", () => { // Assert expect(linearGraph).toHaveTextContent( - "The endpoint is at -5 comma 5 and the terminal point is at 5 comma 5.", + "The endpoint is at -5 comma 5 and the ray goes through point 5 comma 5.", ); }); @@ -118,11 +118,11 @@ describe("Linear graph screen reader", () => { expect(point1).toHaveAttribute("aria-label", "Endpoint at -2 comma 3."); expect(grabHandle).toHaveAttribute( "aria-label", - "Ray from endpoint -2 comma 3 to terminal point 3 comma 3.", + "Ray with endpoint -2 comma 3 going through point 3 comma 3.", ); expect(point2).toHaveAttribute( "aria-label", - "Terminal point at 3 comma 3.", + "Through point at 3 comma 3.", ); }); @@ -168,15 +168,15 @@ describe("describeRayGraph", () => { // Assert expect(strings.srRayGraph).toBe("A ray on a coordinate plane."); expect(strings.srRayPoints).toBe( - "The endpoint is at -5 comma 5 and the terminal point is at 5 comma 5.", + "The endpoint is at -5 comma 5 and the ray goes through point 5 comma 5.", ); expect(strings.srRayEndpoint).toBe("Endpoint at -5 comma 5."); - expect(strings.srRayTerminalPoint).toBe("Terminal point at 5 comma 5."); + expect(strings.srRayTerminalPoint).toBe("Through point at 5 comma 5."); expect(strings.srRayGrabHandle).toBe( - "Ray from endpoint -5 comma 5 to terminal point 5 comma 5.", + "Ray with endpoint -5 comma 5 going through point 5 comma 5.", ); expect(strings.srRayInteractiveElement).toBe( - "Interactive elements: A ray on a coordinate plane. The endpoint is at -5 comma 5 and the terminal point is at 5 comma 5.", + "Interactive elements: A ray on a coordinate plane. The endpoint is at -5 comma 5 and the ray goes through point 5 comma 5.", ); }); @@ -198,15 +198,15 @@ describe("describeRayGraph", () => { // Assert expect(strings.srRayGraph).toBe("A ray on a coordinate plane."); expect(strings.srRayPoints).toBe( - "The endpoint is at -1 comma 2 and the terminal point is at 3 comma 4.", + "The endpoint is at -1 comma 2 and the ray goes through point 3 comma 4.", ); expect(strings.srRayEndpoint).toBe("Endpoint at -1 comma 2."); - expect(strings.srRayTerminalPoint).toBe("Terminal point at 3 comma 4."); + expect(strings.srRayTerminalPoint).toBe("Through point at 3 comma 4."); expect(strings.srRayGrabHandle).toBe( - "Ray from endpoint -1 comma 2 to terminal point 3 comma 4.", + "Ray with endpoint -1 comma 2 going through point 3 comma 4.", ); expect(strings.srRayInteractiveElement).toBe( - "Interactive elements: A ray on a coordinate plane. The endpoint is at -1 comma 2 and the terminal point is at 3 comma 4.", + "Interactive elements: A ray on a coordinate plane. The endpoint is at -1 comma 2 and the ray goes through point 3 comma 4.", ); }); }); diff --git a/packages/perseus/src/widgets/interactive-graphs/mafs-graph.test.tsx b/packages/perseus/src/widgets/interactive-graphs/mafs-graph.test.tsx index 6353d6556a..673baef605 100644 --- a/packages/perseus/src/widgets/interactive-graphs/mafs-graph.test.tsx +++ b/packages/perseus/src/widgets/interactive-graphs/mafs-graph.test.tsx @@ -279,7 +279,7 @@ describe("MafsGraph", () => { ); expectLabelInDoc("Endpoint at 0 comma 0."); - expectLabelInDoc("Terminal point at -7 comma 0.5."); + expectLabelInDoc("Through point at -7 comma 0.5."); }); it("renders ARIA labels for each point (circle)", () => {