add options form, patch sound change autofill no deletion bug
This commit is contained in:
parent
07100ccaa9
commit
63ec56e458
5 changed files with 62 additions and 6 deletions
|
@ -4,6 +4,7 @@ import './PhonoChangeApplier.scss';
|
||||||
import ProtoLang from './components/ProtoLang';
|
import ProtoLang from './components/ProtoLang';
|
||||||
import Features from './components/Features';
|
import Features from './components/Features';
|
||||||
import Epochs from './components/Epochs';
|
import Epochs from './components/Epochs';
|
||||||
|
import Options from './components/Options';
|
||||||
|
|
||||||
const PhonoChangeApplier = () => {
|
const PhonoChangeApplier = () => {
|
||||||
const [ lexicon, setLexicon ] = useState(['one']);
|
const [ lexicon, setLexicon ] = useState(['one']);
|
||||||
|
@ -17,6 +18,7 @@ const PhonoChangeApplier = () => {
|
||||||
<ProtoLang lexicon={lexicon} setLexicon={setLexicon}/>
|
<ProtoLang lexicon={lexicon} setLexicon={setLexicon}/>
|
||||||
<Features phonemes={phonemes} setPhonemes={setPhonemes}/>
|
<Features phonemes={phonemes} setPhonemes={setPhonemes}/>
|
||||||
<Epochs epochs={epochs} setEpochs={setEpochs}/>
|
<Epochs epochs={epochs} setEpochs={setEpochs}/>
|
||||||
|
<Options />
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -2,7 +2,6 @@ import React from 'react';
|
||||||
import ReactDOM from 'react-dom';
|
import ReactDOM from 'react-dom';
|
||||||
import Features from './Features';
|
import Features from './Features';
|
||||||
import renderer from 'react-test-renderer';
|
import renderer from 'react-test-renderer';
|
||||||
import { exportAllDeclaration } from '@babel/types';
|
|
||||||
import {render, fireEvent} from '@testing-library/react';
|
import {render, fireEvent} from '@testing-library/react';
|
||||||
import extendExpect from '@testing-library/jest-dom/extend-expect'
|
import extendExpect from '@testing-library/jest-dom/extend-expect'
|
||||||
|
|
||||||
|
|
|
@ -1,10 +1,43 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import './Options.scss';
|
import './Options.scss';
|
||||||
|
|
||||||
const Options = () => {
|
const Options = props => {
|
||||||
return (<>
|
return (
|
||||||
|
<div className="Options" data-testid="Options">
|
||||||
|
<h3>Modeling Options</h3>
|
||||||
|
<form onSubmit={()=>{}}>
|
||||||
|
|
||||||
</>);
|
{/* <h5>Output</h5> */}
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="radio" name="output" id="output-default" defaultChecked
|
||||||
|
/>
|
||||||
|
<label htmlFor="output-default">Default
|
||||||
|
<span className="Options__output-example"> output</span>
|
||||||
|
</label>
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="radio" name="output" id="output-proto"
|
||||||
|
/>
|
||||||
|
<label htmlFor="output-proto">Proto
|
||||||
|
<span className="Options__output-example"> output [proto]</span>
|
||||||
|
</label>
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="radio" name="output" id="output-diachronic"
|
||||||
|
/><label htmlFor="output-diachronic">Diachronic
|
||||||
|
<span className="Options__output-example"> *proto > *epoch > output</span>
|
||||||
|
</label>
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="checkbox" name="save"
|
||||||
|
/>
|
||||||
|
<label htmlFor="save">Store session on Run</label>
|
||||||
|
|
||||||
|
<input type="submit"></input>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
export default Options;
|
export default Options;
|
22
src/components/Options.test.js
Normal file
22
src/components/Options.test.js
Normal file
|
@ -0,0 +1,22 @@
|
||||||
|
import React from 'react';
|
||||||
|
import ReactDOM from 'react-dom';
|
||||||
|
import Options from './Options';
|
||||||
|
import renderer from 'react-test-renderer';
|
||||||
|
import {render, fireEvent} from '@testing-library/react';
|
||||||
|
import extendExpect from '@testing-library/jest-dom/extend-expect'
|
||||||
|
|
||||||
|
it('renders Options without crashing', () => {
|
||||||
|
const div = document.createElement('div');
|
||||||
|
ReactDOM.render(<Options />, div);
|
||||||
|
ReactDOM.unmountComponentAtNode(div);
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
describe('Options', () => {
|
||||||
|
it('renders the correct subtitle', () => {
|
||||||
|
const { getByTestId } = render(<Options />);
|
||||||
|
expect(getByTestId('Options')).toHaveTextContent('Modeling Options');
|
||||||
|
});
|
||||||
|
|
||||||
|
});
|
Loading…
Reference in a new issue