@instructure/ui-breadcrumb 8.46.1 → 8.46.2-snapshot-1

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [8.46.2-snapshot-1](https://github.com/instructure/instructure-ui/compare/v8.46.1...v8.46.2-snapshot-1) (2023-10-16)
+
+**Note:** Version bump only for package @instructure/ui-breadcrumb
+
+
+
+
+
 ## [8.46.1](https://github.com/instructure/instructure-ui/compare/v8.46.0...v8.46.1) (2023-10-13)
 
 **Note:** Version bump only for package @instructure/ui-breadcrumb

package/es/Breadcrumb/BreadcrumbLink/__new-tests__/BreadcrumbLink.test.js

@@ -0,0 +1,106 @@
+var _BreadcrumbLink, _BreadcrumbLink2, _BreadcrumbLink3, _BreadcrumbLink4, _BreadcrumbLink5, _BreadcrumbLink6;
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+import React from 'react';
+import { fireEvent, render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom/extend-expect';
+import { runAxeCheck } from '@instructure/ui-axe-check';
+import { BreadcrumbLink } from '../index';
+const TEST_TEXT_01 = 'Account';
+const TEST_LINK = 'http://instructure-test.com';
+const TEST_TO = '/example';
+const originalResizeObserver = global.ResizeObserver;
+describe('<BreadcrumbLink />', () => {
+  beforeAll(() => {
+    // Mock for ResizeObserver browser API
+    global.ResizeObserver = jest.fn().mockImplementation(() => ({
+      observe: jest.fn(),
+      unobserve: jest.fn(),
+      disconnect: jest.fn()
+    }));
+  });
+  it('should render an anchor tag when given a href prop', () => {
+    render(_BreadcrumbLink || (_BreadcrumbLink = /*#__PURE__*/React.createElement(BreadcrumbLink, {
+      href: TEST_LINK
+    }, TEST_TEXT_01)));
+    const anchor = screen.getByRole('link');
+    expect(anchor).toHaveAttribute('href', TEST_LINK);
+  });
+  it('should render as a button and respond to onClick event', () => {
+    const onClick = jest.fn();
+    render( /*#__PURE__*/React.createElement(BreadcrumbLink, {
+      onClick: onClick
+    }, TEST_TEXT_01));
+    const button = screen.getByRole('button');
+    fireEvent.click(button);
+    expect(onClick).toHaveBeenCalledTimes(1);
+  });
+  it('should allow to prop to pass through', () => {
+    const _render = render(_BreadcrumbLink2 || (_BreadcrumbLink2 = /*#__PURE__*/React.createElement(BreadcrumbLink, {
+        to: TEST_TO
+      }, TEST_TEXT_01))),
+      container = _render.container;
+    const link = container.querySelector('a');
+    expect(link).toBeInTheDocument();
+    expect(link).toHaveAttribute('to', TEST_TO);
+  });
+  it('should not render a link when not given an href prop', () => {
+    const _render2 = render(_BreadcrumbLink3 || (_BreadcrumbLink3 = /*#__PURE__*/React.createElement(BreadcrumbLink, null, TEST_TEXT_01))),
+      container = _render2.container;
+    const elementWithHref = container.querySelector('[href]');
+    const anchor = container.querySelector('a');
+    const span = container.querySelector('span');
+    expect(elementWithHref).toBeNull();
+    expect(anchor).toBeNull();
+    expect(span).toBeInTheDocument();
+    expect(span).toHaveTextContent(TEST_TEXT_01);
+  });
+  it('should not render a button when not given an onClick prop', () => {
+    const _render3 = render(_BreadcrumbLink4 || (_BreadcrumbLink4 = /*#__PURE__*/React.createElement(BreadcrumbLink, null, TEST_TEXT_01))),
+      container = _render3.container;
+    const button = container.querySelector('button');
+    const span = container.querySelector('span');
+    expect(button).toBeNull();
+    expect(span).toBeInTheDocument();
+    expect(span).toHaveTextContent(TEST_TEXT_01);
+  });
+  it('should meet a11y standards as a link', async () => {
+    const _render4 = render(_BreadcrumbLink5 || (_BreadcrumbLink5 = /*#__PURE__*/React.createElement(BreadcrumbLink, {
+        href: TEST_LINK
+      }, TEST_TEXT_01))),
+      container = _render4.container;
+    const axeCheck = await runAxeCheck(container);
+    expect(axeCheck).toBe(true);
+  });
+  it('should meet a11y standards as a span', async () => {
+    const _render5 = render(_BreadcrumbLink6 || (_BreadcrumbLink6 = /*#__PURE__*/React.createElement(BreadcrumbLink, null, TEST_TEXT_01))),
+      container = _render5.container;
+    const axeCheck = await runAxeCheck(container);
+    expect(axeCheck).toBe(true);
+  });
+  afterAll(() => {
+    global.ResizeObserver = originalResizeObserver;
+  });
+});

package/es/Breadcrumb/__new-tests__/Breadcrumb.test.js

@@ -0,0 +1,92 @@
+var _Breadcrumb, _Breadcrumb2, _Breadcrumb3;
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom/extend-expect';
+
+// eslint-disable-next-line no-restricted-imports
+import { generateA11yTests } from '@instructure/ui-scripts/lib/test/generateA11yTests';
+import { runAxeCheck } from '@instructure/ui-axe-check';
+import { Breadcrumb } from '../index';
+import BreadcrumbExamples from '../__examples__/Breadcrumb.examples';
+const TEST_LABEL = 'You are here:';
+const TEST_TEXT_01 = 'Account';
+const TEST_TEXT_02 = 'Settings';
+const TEST_LINK = 'http://instructure-test.com';
+const originalResizeObserver = global.ResizeObserver;
+describe('<Breadcrumb />', () => {
+  beforeAll(() => {
+    // Mock for ResizeObserver browser API
+    global.ResizeObserver = jest.fn().mockImplementation(() => ({
+      observe: jest.fn(),
+      unobserve: jest.fn(),
+      disconnect: jest.fn()
+    }));
+  });
+  it('should be accessible', async () => {
+    const _render = render(_Breadcrumb || (_Breadcrumb = /*#__PURE__*/React.createElement(Breadcrumb, {
+        label: TEST_LABEL
+      }, /*#__PURE__*/React.createElement(Breadcrumb.Link, {
+        href: TEST_LINK
+      }, TEST_TEXT_01), /*#__PURE__*/React.createElement(Breadcrumb.Link, null, TEST_TEXT_02)))),
+      container = _render.container;
+    const axeCheck = await runAxeCheck(container);
+    expect(axeCheck).toBe(true);
+  });
+  describe('with generated examples', () => {
+    const generatedComponents = generateA11yTests(Breadcrumb, BreadcrumbExamples);
+    it.each(generatedComponents)('should be accessible with example: $description', async ({
+      content
+    }) => {
+      const _render2 = render(content),
+        container = _render2.container;
+      const axeCheck = await runAxeCheck(container);
+      expect(axeCheck).toBe(true);
+    });
+  });
+  it('should render the label as an aria-label attribute', () => {
+    render(_Breadcrumb2 || (_Breadcrumb2 = /*#__PURE__*/React.createElement(Breadcrumb, {
+      label: TEST_LABEL
+    }, /*#__PURE__*/React.createElement(Breadcrumb.Link, null, TEST_TEXT_01))));
+    const label = screen.getByLabelText(TEST_LABEL);
+    expect(label).toBeInTheDocument();
+    expect(label).toHaveAttribute('aria-label', TEST_LABEL);
+  });
+  it('should render an icon as a separator', () => {
+    const _render3 = render(_Breadcrumb3 || (_Breadcrumb3 = /*#__PURE__*/React.createElement(Breadcrumb, {
+        label: TEST_LABEL
+      }, /*#__PURE__*/React.createElement(Breadcrumb.Link, {
+        href: TEST_LINK
+      }, TEST_TEXT_01), /*#__PURE__*/React.createElement(Breadcrumb.Link, null, TEST_TEXT_02)))),
+      container = _render3.container;
+    const icon = container.querySelector('svg');
+    expect(icon).toBeInTheDocument();
+    expect(icon).toHaveAttribute('aria-hidden', 'true');
+  });
+  afterAll(() => {
+    global.ResizeObserver = originalResizeObserver;
+  });
+});

package/lib/Breadcrumb/BreadcrumbLink/__new-tests__/BreadcrumbLink.test.js

@@ -0,0 +1,108 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@testing-library/react");
+require("@testing-library/jest-dom/extend-expect");
+var _runAxeCheck = require("@instructure/ui-axe-check/lib/runAxeCheck.js");
+var _index = require("../index");
+var _BreadcrumbLink, _BreadcrumbLink2, _BreadcrumbLink3, _BreadcrumbLink4, _BreadcrumbLink5, _BreadcrumbLink6;
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+const TEST_TEXT_01 = 'Account';
+const TEST_LINK = 'http://instructure-test.com';
+const TEST_TO = '/example';
+const originalResizeObserver = global.ResizeObserver;
+describe('<BreadcrumbLink />', () => {
+  beforeAll(() => {
+    // Mock for ResizeObserver browser API
+    global.ResizeObserver = jest.fn().mockImplementation(() => ({
+      observe: jest.fn(),
+      unobserve: jest.fn(),
+      disconnect: jest.fn()
+    }));
+  });
+  it('should render an anchor tag when given a href prop', () => {
+    (0, _react2.render)(_BreadcrumbLink || (_BreadcrumbLink = /*#__PURE__*/_react.default.createElement(_index.BreadcrumbLink, {
+      href: TEST_LINK
+    }, TEST_TEXT_01)));
+    const anchor = _react2.screen.getByRole('link');
+    expect(anchor).toHaveAttribute('href', TEST_LINK);
+  });
+  it('should render as a button and respond to onClick event', () => {
+    const onClick = jest.fn();
+    (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_index.BreadcrumbLink, {
+      onClick: onClick
+    }, TEST_TEXT_01));
+    const button = _react2.screen.getByRole('button');
+    _react2.fireEvent.click(button);
+    expect(onClick).toHaveBeenCalledTimes(1);
+  });
+  it('should allow to prop to pass through', () => {
+    const _render = (0, _react2.render)(_BreadcrumbLink2 || (_BreadcrumbLink2 = /*#__PURE__*/_react.default.createElement(_index.BreadcrumbLink, {
+        to: TEST_TO
+      }, TEST_TEXT_01))),
+      container = _render.container;
+    const link = container.querySelector('a');
+    expect(link).toBeInTheDocument();
+    expect(link).toHaveAttribute('to', TEST_TO);
+  });
+  it('should not render a link when not given an href prop', () => {
+    const _render2 = (0, _react2.render)(_BreadcrumbLink3 || (_BreadcrumbLink3 = /*#__PURE__*/_react.default.createElement(_index.BreadcrumbLink, null, TEST_TEXT_01))),
+      container = _render2.container;
+    const elementWithHref = container.querySelector('[href]');
+    const anchor = container.querySelector('a');
+    const span = container.querySelector('span');
+    expect(elementWithHref).toBeNull();
+    expect(anchor).toBeNull();
+    expect(span).toBeInTheDocument();
+    expect(span).toHaveTextContent(TEST_TEXT_01);
+  });
+  it('should not render a button when not given an onClick prop', () => {
+    const _render3 = (0, _react2.render)(_BreadcrumbLink4 || (_BreadcrumbLink4 = /*#__PURE__*/_react.default.createElement(_index.BreadcrumbLink, null, TEST_TEXT_01))),
+      container = _render3.container;
+    const button = container.querySelector('button');
+    const span = container.querySelector('span');
+    expect(button).toBeNull();
+    expect(span).toBeInTheDocument();
+    expect(span).toHaveTextContent(TEST_TEXT_01);
+  });
+  it('should meet a11y standards as a link', async () => {
+    const _render4 = (0, _react2.render)(_BreadcrumbLink5 || (_BreadcrumbLink5 = /*#__PURE__*/_react.default.createElement(_index.BreadcrumbLink, {
+        href: TEST_LINK
+      }, TEST_TEXT_01))),
+      container = _render4.container;
+    const axeCheck = await (0, _runAxeCheck.runAxeCheck)(container);
+    expect(axeCheck).toBe(true);
+  });
+  it('should meet a11y standards as a span', async () => {
+    const _render5 = (0, _react2.render)(_BreadcrumbLink6 || (_BreadcrumbLink6 = /*#__PURE__*/_react.default.createElement(_index.BreadcrumbLink, null, TEST_TEXT_01))),
+      container = _render5.container;
+    const axeCheck = await (0, _runAxeCheck.runAxeCheck)(container);
+    expect(axeCheck).toBe(true);
+  });
+  afterAll(() => {
+    global.ResizeObserver = originalResizeObserver;
+  });
+});

package/lib/Breadcrumb/__new-tests__/Breadcrumb.test.js

@@ -0,0 +1,93 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@testing-library/react");
+require("@testing-library/jest-dom/extend-expect");
+var _generateA11yTests = require("@instructure/ui-scripts/lib/test/generateA11yTests");
+var _runAxeCheck = require("@instructure/ui-axe-check/lib/runAxeCheck.js");
+var _index = require("../index");
+var _Breadcrumb4 = _interopRequireDefault(require("../__examples__/Breadcrumb.examples"));
+var _Breadcrumb, _Breadcrumb2, _Breadcrumb3;
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+// eslint-disable-next-line no-restricted-imports
+const TEST_LABEL = 'You are here:';
+const TEST_TEXT_01 = 'Account';
+const TEST_TEXT_02 = 'Settings';
+const TEST_LINK = 'http://instructure-test.com';
+const originalResizeObserver = global.ResizeObserver;
+describe('<Breadcrumb />', () => {
+  beforeAll(() => {
+    // Mock for ResizeObserver browser API
+    global.ResizeObserver = jest.fn().mockImplementation(() => ({
+      observe: jest.fn(),
+      unobserve: jest.fn(),
+      disconnect: jest.fn()
+    }));
+  });
+  it('should be accessible', async () => {
+    const _render = (0, _react2.render)(_Breadcrumb || (_Breadcrumb = /*#__PURE__*/_react.default.createElement(_index.Breadcrumb, {
+        label: TEST_LABEL
+      }, /*#__PURE__*/_react.default.createElement(_index.Breadcrumb.Link, {
+        href: TEST_LINK
+      }, TEST_TEXT_01), /*#__PURE__*/_react.default.createElement(_index.Breadcrumb.Link, null, TEST_TEXT_02)))),
+      container = _render.container;
+    const axeCheck = await (0, _runAxeCheck.runAxeCheck)(container);
+    expect(axeCheck).toBe(true);
+  });
+  describe('with generated examples', () => {
+    const generatedComponents = (0, _generateA11yTests.generateA11yTests)(_index.Breadcrumb, _Breadcrumb4.default);
+    it.each(generatedComponents)('should be accessible with example: $description', async ({
+      content
+    }) => {
+      const _render2 = (0, _react2.render)(content),
+        container = _render2.container;
+      const axeCheck = await (0, _runAxeCheck.runAxeCheck)(container);
+      expect(axeCheck).toBe(true);
+    });
+  });
+  it('should render the label as an aria-label attribute', () => {
+    (0, _react2.render)(_Breadcrumb2 || (_Breadcrumb2 = /*#__PURE__*/_react.default.createElement(_index.Breadcrumb, {
+      label: TEST_LABEL
+    }, /*#__PURE__*/_react.default.createElement(_index.Breadcrumb.Link, null, TEST_TEXT_01))));
+    const label = _react2.screen.getByLabelText(TEST_LABEL);
+    expect(label).toBeInTheDocument();
+    expect(label).toHaveAttribute('aria-label', TEST_LABEL);
+  });
+  it('should render an icon as a separator', () => {
+    const _render3 = (0, _react2.render)(_Breadcrumb3 || (_Breadcrumb3 = /*#__PURE__*/_react.default.createElement(_index.Breadcrumb, {
+        label: TEST_LABEL
+      }, /*#__PURE__*/_react.default.createElement(_index.Breadcrumb.Link, {
+        href: TEST_LINK
+      }, TEST_TEXT_01), /*#__PURE__*/_react.default.createElement(_index.Breadcrumb.Link, null, TEST_TEXT_02)))),
+      container = _render3.container;
+    const icon = container.querySelector('svg');
+    expect(icon).toBeInTheDocument();
+    expect(icon).toHaveAttribute('aria-hidden', 'true');
+  });
+  afterAll(() => {
+    global.ResizeObserver = originalResizeObserver;
+  });
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-breadcrumb",
-  "version": "8.46.1",
+  "version": "8.46.2-snapshot-1",
   "description": "A breadcrumb component",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -23,23 +23,25 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.46.1",
-    "@instructure/ui-test-locator": "8.46.1",
-    "@instructure/ui-test-utils": "8.46.1",
-    "@instructure/ui-themes": "8.46.1"
+    "@instructure/ui-axe-check": "8.46.2-snapshot-1",
+    "@instructure/ui-babel-preset": "8.46.2-snapshot-1",
+    "@instructure/ui-scripts": "8.46.2-snapshot-1",
+    "@instructure/ui-themes": "8.46.2-snapshot-1",
+    "@testing-library/jest-dom": "^5.17.0",
+    "@testing-library/react": "^14.0.0"
   },
   "dependencies": {
     "@babel/runtime": "^7.22.15",
-    "@instructure/emotion": "8.46.1",
-    "@instructure/shared-types": "8.46.1",
-    "@instructure/ui-icons": "8.46.1",
-    "@instructure/ui-link": "8.46.1",
-    "@instructure/ui-prop-types": "8.46.1",
-    "@instructure/ui-react-utils": "8.46.1",
-    "@instructure/ui-testable": "8.46.1",
-    "@instructure/ui-truncate-text": "8.46.1",
-    "@instructure/ui-utils": "8.46.1",
-    "@instructure/ui-view": "8.46.1",
+    "@instructure/emotion": "8.46.2-snapshot-1",
+    "@instructure/shared-types": "8.46.2-snapshot-1",
+    "@instructure/ui-icons": "8.46.2-snapshot-1",
+    "@instructure/ui-link": "8.46.2-snapshot-1",
+    "@instructure/ui-prop-types": "8.46.2-snapshot-1",
+    "@instructure/ui-react-utils": "8.46.2-snapshot-1",
+    "@instructure/ui-testable": "8.46.2-snapshot-1",
+    "@instructure/ui-truncate-text": "8.46.2-snapshot-1",
+    "@instructure/ui-utils": "8.46.2-snapshot-1",
+    "@instructure/ui-view": "8.46.2-snapshot-1",
     "prop-types": "^15.8.1"
   },
   "peerDependencies": {

package/src/Breadcrumb/BreadcrumbLink/__new-tests__/BreadcrumbLink.test.tsx

@@ -0,0 +1,123 @@
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+import React from 'react'
+import { fireEvent, render, screen } from '@testing-library/react'
+import '@testing-library/jest-dom/extend-expect'
+
+import { runAxeCheck } from '@instructure/ui-axe-check'
+import { BreadcrumbLink } from '../index'
+
+const TEST_TEXT_01 = 'Account'
+const TEST_LINK = 'http://instructure-test.com'
+const TEST_TO = '/example'
+
+const originalResizeObserver = global.ResizeObserver
+
+describe('<BreadcrumbLink />', () => {
+  beforeAll(() => {
+    // Mock for ResizeObserver browser API
+    global.ResizeObserver = jest.fn().mockImplementation(() => ({
+      observe: jest.fn(),
+      unobserve: jest.fn(),
+      disconnect: jest.fn()
+    }))
+  })
+
+  it('should render an anchor tag when given a href prop', () => {
+    render(<BreadcrumbLink href={TEST_LINK}>{TEST_TEXT_01}</BreadcrumbLink>)
+    const anchor = screen.getByRole('link')
+
+    expect(anchor).toHaveAttribute('href', TEST_LINK)
+  })
+
+  it('should render as a button and respond to onClick event', () => {
+    const onClick = jest.fn()
+
+    render(<BreadcrumbLink onClick={onClick}>{TEST_TEXT_01}</BreadcrumbLink>)
+    const button = screen.getByRole('button')
+
+    fireEvent.click(button)
+
+    expect(onClick).toHaveBeenCalledTimes(1)
+  })
+
+  it('should allow to prop to pass through', () => {
+    const { container } = render(
+      <BreadcrumbLink to={TEST_TO}>{TEST_TEXT_01}</BreadcrumbLink>
+    )
+    const link = container.querySelector('a')
+
+    expect(link).toBeInTheDocument()
+    expect(link).toHaveAttribute('to', TEST_TO)
+  })
+
+  it('should not render a link when not given an href prop', () => {
+    const { container } = render(
+      <BreadcrumbLink>{TEST_TEXT_01}</BreadcrumbLink>
+    )
+    const elementWithHref = container.querySelector('[href]')
+    const anchor = container.querySelector('a')
+    const span = container.querySelector('span')
+
+    expect(elementWithHref).toBeNull()
+    expect(anchor).toBeNull()
+    expect(span).toBeInTheDocument()
+    expect(span).toHaveTextContent(TEST_TEXT_01)
+  })
+
+  it('should not render a button when not given an onClick prop', () => {
+    const { container } = render(
+      <BreadcrumbLink>{TEST_TEXT_01}</BreadcrumbLink>
+    )
+    const button = container.querySelector('button')
+    const span = container.querySelector('span')
+
+    expect(button).toBeNull()
+    expect(span).toBeInTheDocument()
+    expect(span).toHaveTextContent(TEST_TEXT_01)
+  })
+
+  it('should meet a11y standards as a link', async () => {
+    const { container } = render(
+      <BreadcrumbLink href={TEST_LINK}>{TEST_TEXT_01}</BreadcrumbLink>
+    )
+    const axeCheck = await runAxeCheck(container)
+
+    expect(axeCheck).toBe(true)
+  })
+
+  it('should meet a11y standards as a span', async () => {
+    const { container } = render(
+      <BreadcrumbLink>{TEST_TEXT_01}</BreadcrumbLink>
+    )
+    const axeCheck = await runAxeCheck(container)
+
+    expect(axeCheck).toBe(true)
+  })
+
+  afterAll(() => {
+    global.ResizeObserver = originalResizeObserver
+  })
+})