Javascript 语义ui react:如何使用classname更改输入值选择?
我正在测试由语义用户界面reactJavascript 语义ui react:如何使用classname更改输入值选择?,javascript,reactjs,react-testing-library,semantic-ui-react,Javascript,Reactjs,React Testing Library,Semantic Ui React,我正在测试由语义用户界面reactSearch模块编写的react应用程序 我想在输入值更改时测试输入, 我用{target:{value:'foo'}}尝试了fireEvent.change,值没有更改,它不起作用。 我认为问题在于我选择了错误的标记,或者没有执行重新渲染组件。 但我不知道什么才是真正重要的 下面的代码是组件 import { Search } from 'semantic-ui-react'; <Search data-testid="Searc
Search
模块编写的react应用程序我想在输入值更改时测试输入,
我用
{target:{value:'foo'}}
尝试了fireEvent.change
,值没有更改,它不起作用。我认为问题在于我选择了错误的标记,或者没有执行重新渲染组件。 但我不知道什么才是真正重要的 下面的代码是组件
import { Search } from 'semantic-ui-react';
<Search
data-testid="SearchBox"
fluid
action
loading={loading}
onSearchChange={handleSearchChange}
onResultSelect={handleResultSelect}
results={results}
value={value}
/>
从“语义ui反应”导入{Search};
我试过调试
const mockStore = getMockStore(initialAuthState, initialStockState);
describe('<SearchBox />', () => {
let searchbox;
beforeEach(() => {
searchbox = (
<Provider store={mockStore}>
<SearchBox history={history}/>
</Provider>
);
jest.spyOn(axios, "get").mockImplementation(() => {
const response = {
status : 200,
data : stubStock,
};
return Promise.resolve(response);
});
});
afterEach(() => {
jest.clearAllMocks();
});
it('should work', () => {
const {debug} = render(searchbox);
debug();
});
});
const mockStore=getMockStore(initialAuthState,initialStockState);
描述(“”,()=>{
让搜索框;
在每个之前(()=>{
搜索框=(
);
jest.spyOn(axios,“get”).mock实现(()=>{
常数响应={
现状:200,
数据:stubStock,
};
回报承诺。解决(回应);
});
});
之后(()=>{
开玩笑。clearAllMocks();
});
它('应该工作',()=>{
const{debug}=render(searchbox);
调试();
});
});
结果如下:
<div>
<div
class="ui fluid search"
data-testid="SearchBox"
>
<div
class="ui icon input"
>
<input
autocomplete="off"
class="prompt"
tabindex="0"
type="text"
value=""
/>
<i
aria-hidden="true"
class="search icon"
/>
</div>
<div
class="results transition"
>
<div
class="message empty"
>
<div
class="header"
>
No results found.
</div>
</div>
</div>
</div>
</div>
</body>
没有发现任何结果。
你能发一封邮件吗?例如,我们无法看到您如何调用fireEvent.change
,这可能是您问题中最重要的一行代码!如果您可以发布一个简单、完整的示例,让其他用户可以轻松复制和测试,您就更有可能获得更好的响应。