3px solid red
. Puedes probarlo ingresando texto en la entrada. GateKeeper
debe representar un elemento div
.
testString: 'assert((function() { const mockedComponent = Enzyme.mount(React.createElement(GateKeeper)); return mockedComponent.find("div").length === 1; })(), "The GateKeeper
component should render a div
element.");'
- text: El componente GateKeeper
debe inicializarse con una input
clave de estado establecida en una cadena vacía.
testString: 'assert((function() { const mockedComponent = Enzyme.mount(React.createElement(GateKeeper)); return mockedComponent.state().input === ""; })(), "The GateKeeper
component should be initialized with a state key input
set to an empty string.");'
- text: El componente GateKeeper
debe representar una etiqueta h3
y una etiqueta de input
.
testString: 'assert((function() { const mockedComponent = Enzyme.mount(React.createElement(GateKeeper)); return mockedComponent.find("h3").length === 1 && mockedComponent.find("input").length === 1; })(), "The GateKeeper
component should render an h3
tag and an input
tag.");'
- text: La etiqueta de input
debe tener inicialmente un estilo de 1px solid black
para la propiedad de border
.
testString: 'assert((function() { const mockedComponent = Enzyme.mount(React.createElement(GateKeeper)); return mockedComponent.find("input").props().style.border === "1px solid black"; })(), "The input
tag should initially have a style of 1px solid black
for the border
property.");'
- text: La etiqueta de input
debe tener un estilo con un borde de 3px solid red
si el valor de entrada en el estado es más largo que 15 caracteres.
testString: 'async () => { const waitForIt = (fn) => new Promise((resolve, reject) => setTimeout(() => resolve(fn()), 100)); const mockedComponent = Enzyme.mount(React.createElement(GateKeeper)); const simulateChange = (el, value) => el.simulate("change", {target: {value}}); let initialStyle = mockedComponent.find("input").props().style.border; const state_1 = () => { mockedComponent.setState({input: "this is 15 char" }); return waitForIt(() => mockedComponent.find("input").props().style.border )}; const state_2 = () => { mockedComponent.setState({input: "A very long string longer than 15 characters." }); return waitForIt(() => mockedComponent.find("input").props().style.border )}; const style_1 = await state_1(); const style_2 = await state_2(); assert(initialStyle === "1px solid black" && style_1 === "1px solid black" && style_2 === "3px solid red", "The input
tag should be styled with a border of 3px solid red
if the input value in state is longer than 15 characters."); }; '
```