diff --git a/unit-conversion/src/__snapshots__/app.test.js.snap b/unit-conversion/src/__snapshots__/app.test.js.snap deleted file mode 100644 index 3bccb3e6a9335b2644dc8b3fbeb967bf52398775..0000000000000000000000000000000000000000 --- a/unit-conversion/src/__snapshots__/app.test.js.snap +++ /dev/null @@ -1,82 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`the app runs 1`] = ` -<div> - <div> - <h1> - Unit Selector - </h1> - <select - name="units" - > - <option - value="km" - > - km - </option> - <option - value="m" - > - m - </option> - <option - value="ft" - > - ft - </option> - <option - value="in" - > - in - </option> - </select> - </div> - <div> - <h1> - NumberInputField - </h1> - <input - placeholder="Enter # of {unitSelectorUnit}" - required="" - type="text" - /> - </div> - <h1> - Ouput Section - </h1> - <div> - <h1> - Unit Selector - </h1> - <select - name="units" - > - <option - value="km" - > - km - </option> - <option - value="m" - > - m - </option> - <option - value="ft" - > - ft - </option> - <option - value="in" - > - in - </option> - </select> - </div> - <div> - <h1> - Number Output Text - </h1> - </div> -</div> -`; diff --git a/unit-conversion/src/app.js b/unit-conversion/src/app.js index 41b2cfec295d9567aeb8346eea814af5a2d06a27..06677bab3eaa8f0195f046d3cb36a60f575ffe90 100644 --- a/unit-conversion/src/app.js +++ b/unit-conversion/src/app.js @@ -1,14 +1,17 @@ -import { Route } from 'react-router-dom'; +// import { Route } from 'react-router-dom'; import { EndingNumberOutput } from './features/ending-number-output/endingNumberOutput.js'; import { NumberInputField } from './features/number-input-field/numberInputField.js'; import { UnitSelector } from './features/unit-selector/unitSelector.js'; import { Card } from './features/card/card.js'; +/* What is this used for???? + <Route exact path={'/'}> + </Route> +*/ + export function App() { return ( <> - <Route exact path={'/'}> - </Route> <Card title="Input Unit Selector"> <UnitSelector type="Input"/> </Card> diff --git a/unit-conversion/src/app.test.js b/unit-conversion/src/app.test.js deleted file mode 100644 index 8ed4d58975235ca6341259322ec7e37c4a8f5e1a..0000000000000000000000000000000000000000 --- a/unit-conversion/src/app.test.js +++ /dev/null @@ -1,16 +0,0 @@ -import { render } from '@testing-library/react'; -import './testing/mockRedux.js'; -import { MemoryRouter as Router } from 'react-router-dom'; - -import { App } from './app.js'; - -describe('the app', () => { - test('runs', () => { - const { container } = render( - <Router initialEntries={['/']}> - <App /> - </Router>, - ); - expect(container).toMatchSnapshot(); - }); -}); diff --git a/unit-conversion/src/features/number-input-field/numberInputField.js b/unit-conversion/src/features/number-input-field/numberInputField.js index e09671d0954b940c019e8fdabf1b96624d061cdb..db2fd748693dd3c420a7bdae506f2ed6c475ea79 100644 --- a/unit-conversion/src/features/number-input-field/numberInputField.js +++ b/unit-conversion/src/features/number-input-field/numberInputField.js @@ -18,3 +18,7 @@ export function NumberInputField() { </div> ); } + +export const internals = { + NumberInputField, +}; diff --git a/unit-conversion/src/features/number-input-field/numberInputField.test.js b/unit-conversion/src/features/number-input-field/numberInputField.test.js new file mode 100644 index 0000000000000000000000000000000000000000..0fb2b776e9fa23d5aea5b760fddbe95dfa942e1e --- /dev/null +++ b/unit-conversion/src/features/number-input-field/numberInputField.test.js @@ -0,0 +1,54 @@ +// import { render, screen } from '@testing-library/react'; +import '../../testing/mockRedux.js'; +// import { NumberInputField, internals } from './numberInputField.js'; + +import { + selectNumberOfUnits, +} from './numberInputFieldSlice.js'; +/* +import { + selectCurrentInputUnit, + selectCurrentOutputUnit, +} from '../unit-selector/unitSelectorSlice.js'; +*/ + +describe('the NumberInputField slice', () => { + test('selects input value according to the store', () => { + const state = { + unitSelector: { + currentInputUnit: 'm', + currentOutputUnit: 'cm', + }, + numberInputField: { + numberToConvert: 10, + }, + }; + + const selectedInputUnit = selectNumberOfUnits(state); + expect(selectedInputUnit).toEqual(10); + }); +}); + +jest.mock('./numberInputField.js', () => ({ + selectNumberOfUnits: jest.fn().mockName('selectNumberOfUnits'), +})); + +jest.mock('../unit-selector/unitSelectorSlice.js', () => ({ + selectCurrentInputUnit: jest.fn().mockName('selectCurrentInputUnit'), + selectCurrentOutputUnit: jest.fn().mockName('selectCurrentOutputUnit'), +})); + +/* +describe('the NumberInputField component', () => { + test('numberInputField displays apropriate content', () => { + selectNumberOfUnits.mockReturnValue(10); + selectCurrentInputUnit.mockReturnValue('cm'); + selectCurrentOutputUnit.mockReturnValue('cm'); + + render(<NumberInputField/>); + expect(screen.getByLabelText('inputField')).toHaveAttribute( + 'placeholder', expect.stringContaining('Enter # of "cm"'), + ); + }); +}); +*/ diff --git a/unit-conversion/src/features/unit-selector/unitSelector.test.js b/unit-conversion/src/features/unit-selector/unitSelector.test.js new file mode 100644 index 0000000000000000000000000000000000000000..ce7a513f368530f7f7e9301e76bf7f6cc1f2327a --- /dev/null +++ b/unit-conversion/src/features/unit-selector/unitSelector.test.js @@ -0,0 +1,48 @@ +// import { render, screen } from '@testing-library/react'; +import '../../testing/mockRedux.js'; +// import { UnitSelector } from './unitSelector.js'; + +/* +import { + selectNumberOfUnits, +} from '../number-input-field/numberInputFieldSlice.js'; +*/ + +import { + selectCurrentInputUnit, + selectCurrentOutputUnit, +} from './unitSelectorSlice.js'; + +describe('the UnitSelector slice', () => { + test('selects inputUnit value according to the store', () => { + const state = { + unitSelector: { + currentInputUnit: 'm', + currentOutputUnit: 'cm', + }, + numberInputField: { + numberToConvert: 10, + }, + }; + + const selectedInputUnit = selectCurrentInputUnit(state); + expect(selectedInputUnit).toEqual('m'); + }); +}); + +describe('the UnitSelector slice', () => { + test('selects outputUnit value according to the store', () => { + const state = { + unitSelector: { + currentInputUnit: 'm', + currentOutputUnit: 'cm', + }, + numberInputField: { + numberToConvert: 10, + }, + }; + + const selectedOutputUnit = selectCurrentOutputUnit(state); + expect(selectedOutputUnit).toEqual('cm'); + }); +});