diff --git a/README.md b/README.md index 7d29a67..b23b1c4 100644 --- a/README.md +++ b/README.md @@ -103,6 +103,7 @@ export default App; | `endShape` | `Object` | An object containing the props to configure the "end shape" of the arrow. Can be one of `arrow` (default) or `circle`. See [`ShapeType`](flow-typed/archer-types.js) for a complete list of available options. | `startMarker` | `boolean` | Optional flag (default `false`) to also add a marker at the start of the arrow. | `endMarker` | `boolean` | Optional flag (default `true`) to remove the marker at the end of the arrow. +| `ignoreNotFoundWarnings` | `boolean` | Set this to true if you want to ignore warnings when a target or source is not found #### Instance methods diff --git a/src/ArcherContainer/ArcherContainer.tsx b/src/ArcherContainer/ArcherContainer.tsx index b5da4b3..0d677df 100644 --- a/src/ArcherContainer/ArcherContainer.tsx +++ b/src/ArcherContainer/ArcherContainer.tsx @@ -36,6 +36,7 @@ const ArcherContainer = React.forwardRef { expect.stringMatching('Could not find target element'), ); }); + + it('should render no arrow if id is not found and not raise a console.warn', () => { + console.warn = jest.fn(); + + const screen = render( + + +
element 1
+
+ +
element 2
+
+
, + ); + + expect(screen.baseElement).toMatchSnapshot(); + expect(console.warn).not.toHaveBeenCalledWith( + expect.stringMatching('Could not find target element'), + ); + }); }); describe('Event Listeners', () => { diff --git a/src/ArcherContainer/__tests__/__snapshots__/ArcherContainer.test.tsx.snap b/src/ArcherContainer/__tests__/__snapshots__/ArcherContainer.test.tsx.snap index 1b6ee36..91c6d8c 100644 --- a/src/ArcherContainer/__tests__/__snapshots__/ArcherContainer.test.tsx.snap +++ b/src/ArcherContainer/__tests__/__snapshots__/ArcherContainer.test.tsx.snap @@ -92,6 +92,47 @@ exports[`ArcherContainer rendering an svg with the marker element used to draw a `; +exports[`ArcherContainer rendering an svg with the marker element used to draw an svg arrow should render no arrow if id is not found and not raise a console.warn 1`] = ` + +
+
+ + + + + + + +
+
+ element 1 +
+
+ element 2 +
+
+
+
+ +`; + exports[`ArcherContainer rendering an svg with the marker element used to draw an svg arrow should render simple elements 1`] = `
diff --git a/src/ArcherContainer/components/SvgArrows.tsx b/src/ArcherContainer/components/SvgArrows.tsx index c6ed4a4..fbecfbe 100644 --- a/src/ArcherContainer/components/SvgArrows.tsx +++ b/src/ArcherContainer/components/SvgArrows.tsx @@ -19,6 +19,7 @@ interface CommonProps { noCurves: ArcherContainerProps['noCurves']; lineStyle: ArcherContainerProps['lineStyle']; offset: ArcherContainerProps['offset']; + ignoreNotFoundWarnings: ArcherContainerProps['ignoreNotFoundWarnings']; uniqueId: string; refs: Record; } @@ -60,12 +61,18 @@ const AdaptedArrow = ( ); if (!startingPoint) { - console.warn('[React Archer] Could not find starting point of element! Not drawing the arrow.'); + if (!props.ignoreNotFoundWarnings) { + console.warn( + '[React Archer] Could not find starting point of element! Not drawing the arrow.', + ); + } return null; } if (!endingPoint) { - console.warn('[React Archer] Could not find target element! Not drawing the arrow.'); + if (!props.ignoreNotFoundWarnings) { + console.warn('[React Archer] Could not find target element! Not drawing the arrow.'); + } return null; } @@ -125,6 +132,7 @@ export const SvgArrows = ( noCurves={props.noCurves} lineStyle={props.lineStyle} offset={props.offset} + ignoreNotFoundWarnings={props.ignoreNotFoundWarnings} parentCoordinates={parentCoordinates} refs={props.refs} uniqueId={props.uniqueId}