文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Sentry 的前端测试实践：从 Enzyme 迁移到 RTL

上图是对单个组件的 Jest 测试结果。由于每个测试案例执行后缺少清理操作，每个测试的执行时间都会变长。 我们进行了 PoC，证明使用 RTL 会让测试执行稍微快一些。...然而，从长远来看，这个解决方案也不行，因为 React 18 会进行全面重写，而且考虑到 Airbnb 已经放弃对 Enzyme 的支持，这个解决方案是不会长久的。...其中的一个查询是 getByRole，用于查询可访问性树中公开的所有元素，根据 RTL 的指南，这个查询应该是我们的首选项。 尽管 getByRole 很有用，但我们发现这个查询的性能非常差。...一个非常慢的测试从 94.93 秒下降到了 47.52 秒，这个测试涉及了多次单击、大量样式化组件和 react-select（也使用 getComputedStyle 放置下拉列表）。 4....因为对前端测试进行类型化对我们来说非常有好处，所以我们打算制定一个计划，将它们全部转换为 TypeScript。 总    结 我们很高兴看到我们所有的前端测试都迁移到了 RTL！

57610

是时候说再见了，Enzyme.js

我们都改变了自己对基于函数的组件的看法，以前我们认为它们只是无状态和纯表示形式的，现在则把它们看作是基于类组件的完全成熟的替代品。许多 React 教程在那一刻也就此过时了。...虽然他们承诺继续支持 Enzyme，但他们也提到React Testing Library 在他们的项目中越来越受欢迎： 虽然 React Testing Library 等替代选项在 Airbnb 中获得了更多关注...对 React 17 的支持也是近一年来的一个开放问题，你只能在 6 个试图为 Enzyme 提供 React 17 支持的非官方适配器中做出选择，每个适配器都解决了自己的一部分问题，也有自己的一些麻烦...毕竟，我们都相信他们对 React 实现的计划，以及他们塑造 React API 的方式。所以当他们推荐使用 React Testing Library 时，他们应该是有着充分理由的。...不过，我认为这是一条重要的信息——React 背后的专家和社区已经评估了各种选项并做出了选择。如果你不想深入研究为什么 RTL 比 Enzyme 更好，那么你应该先去看看官方文档来了解相关知识。

43210
您找到你想要的搜索结果了吗？
是的
没有找到

Ant Design 4.0 正式版来了！

与此同时，我们也将 v4 依赖的 React 最低版本要求升级到了 React 16.9。这意味着，v4 版本将会提供更多的 hooks 以简化你的代码。...进行了改造，其默认使用虚拟滚动技术进行性能优化以承载大数据量的选项渲染。...Living demo[5] 此外，也对键盘交互以及无障碍进行了优化。 更多新功能/特性/优化部分 ConfigProvider 提供 direction 配置以支持 rtl 语言国际化。...以上 Ant Design 4.0 的诞生离不开社区志愿者的贡献与支持，感谢 @saeedrahimi[8] 实现了 rtl 的国际化功能，@shaodahong[9] 对于兼容包的贡献，以及每个参与帮助开发的人...[5] Living demo: https://ant.design/components/select-cn/#components-select-demo-big-data [6] 此处: https

3.2K30

TDesign 更新周报（2022年6月第4周)

修复 firstFullRow 存在时，拖拽排序的顺序不正确问题Table： 修复加载更多的加载组件尺寸异常问题TimePicker： range 组件最外层使用 range-picker 命名与单时间选项区分详情见...： 默认移除全局 reset 样式引入，可从 tdesign-react/dist/reset.css 中单独引入，存在不兼容更新FeaturesSpace： 新增 Space 组件taginput：...： 修复输入部分特殊符号过滤时组件崩溃的问题Table： 修复仅有firstFullRow渲染为空的问题Select： onChange事件回调参数缺失Form： 修复 number 校验无效问题详情见...自定义模式下移除无效的引用详情见：https://github.com/Tencent/tdesign-starter-cli/releases/tag/0.2.4TDesign Vue Next Starter...发布 0.3.5Features调整类型相关问题的项目结构改造请求封装相关代码Bug Fixes修复首页TAB关闭其他时的异常修复升级 0.16 版本后自定义设置中选项样式的异常详情见：https:/

1.2K20

干货 | 国际化探索之路-Trip.com如何走进阿拉伯市场

图1 LTR与RTL语言对比 适配阿拉伯语言本质上是对RTL的适配，也就是对从右到左的阅读方式的支持。这个将用户界面从LTR适配到RTL的过程，称之为镜像（如图2所示）。 ?...之后Android 4.2才开始对RTL有了全面的支持。所以如果App支持4.2以下的系统，代码中需要对版本进行判断。...测试调试：在Android 4.4（API 级别 19）或更高版本的设备上，在开发者选项中允许启用强制使用从右到左的布局方向。这样我们可以不用调整手机系统语言也可以看到RTL的效果。...-42.html https://github.com/duolingo/rtl-viewpager [2] React Native： https://reactnative.dev/blog/2016.../08/19/right-to-left-support-for-react-native-apps https://reactnative.dev/docs/native-modules-android

4.1K41

TDesign 更新周报（2022年7月第2周）

组件库Vue2 for Web 发布 0.43.3 FeaturesCascader: 基于 select-input 重构, 文本过长省略使用原生 title 展示全文本，不再使用 tooltip 组件增加...CheckBox: 增加 title 属性透传DatePicker: 新增 panelPreselection api优化面板月份展示Drawer: 优化抽屉拖拽体验 Bug FixesSpace: 过滤无效的节点...，文本过长未处理的问题修复选中内容过多时，再点击选择器后的闪动问题SelectInput: 修复 overlayStyle 响应式无法更新的问题TagInput: 修复 inputProps 属性透传无效...: 修复远程搜索动态生成选项失败的缺陷虚拟滚动支持远程搜索场景Dialog: 修复阻止冒泡导致 popup 无法正常关闭Drawer: 修复头部渲染异常问题Input: 修复 Input 组件 切换 type...ChangesDropdownMenu: 属性 overlay 更名为 showOverlay，存在不兼容更新Popup: 移除 transitionProps 属性，存在不兼容更新 Bug FixesTabs: 修复选项卡不存在时滑动报错问题

2.2K10

TDesign 更新周报（2022年5月第4周）

normal风格下无效 Drawer：修复 Drawer使用按键关闭时 contenteditable 出现的边框 Layout：去除 Header额外高度设置 详情见：https://github.com...normal风格下无效 ColorPicker：点击panel会关闭的问题 Select：修复 option显示问题 Affix：兼容场景 详情见：https://github.com...：修复使用 creatable 创建新条目时，会出现额外空选项 Select：修复 showArrow 属性设置为 false，右侧箭头依然显示 Progress：修复 theme 动态变化错误 Transfer...：修复 transfer 选中态无法点击 详情见：https://github.com/Tencent/tdesign-vue-next/releases/tag/0.15.1 React for Web...：修复 totalContent jsx 渲染失败问题 Datepicker：修复 popupProps 透传优先级问题 详情见：https://github.com/Tencent/tdesign-react

1.6K30

TDesign 更新周报（2022年7月第1周）

Slider: 使用 InputNumber 时在使用 range 属性情况下传入 min 或 max 会导致手动输入显示 NaN 问题Select: 修复多选下换行提前占满一行的问题Select: 修复...存在不兼容更新Picker:重构Picker组件 ，存在不兼容更新移除子组件，新增基于Picker开发的级联选择组件新增columns，代表配置每一列的选项...事件Collapse:存在不兼容更新accordion 更名为 expandMutex移除 title、labelWidth 属性新增 disabled、expandIcon、onChange 属性无效的问题...事件新增支持 allowUploadDuplicateFile 属性 Bug FixesBadge: 修复 showZero 属性无效的问题Badge: 修复 maxCount 属性无效的问题DropdownMenu...for Mobile 发布 0.1.0适配移动端交互基于 React 16.x（全部基于 React Hooks 的 Functional Component）与其他框架/库（Vue / Angular

2.2K10

TDesign 更新周报（2022年6月第3周）

Select：修复透传 inputProps 参数无效switch：修复 slots.label 参数无效TreeSelect：优化过滤状态下的输入框交互，修复 selectInput 参数透传数据响应问题...CheckBox：修复二次封装多选框组件插槽定义选项失效Upload：修复图片列表模式存在图片列表的情况下，拖拽图片会触发浏览器默认打开图片行为Slider：修复 slider 数字输入框初始化重复渲染问题...enable-time-picker 状态下，prefixIcon 不起作用详情见：https://github.com/Tencent/tdesign-vue-next/releases/tag/0.16.0React... 存在时，拖拽排序的顺序不正确问题timepicker: 修复初始化滚动问题Select: 修复 minCollapsedNum 无效问题Skeleton: 修复 ts 类型问题Tabs: 修复左右切换渲染问题...Dialog: 修复 mask 关闭问题详情见：https://github.com/Tencent/tdesign-react/releases/tag/0.35.1Miniprogram for WeChat

3K10

IC 圆桌派，第四日『低功耗』复盘

EDA 上云对大企业跟中小企业的意义各是什么？ EDA 上云后对工程师的工作习惯有哪些改变？...没有debug 需求，只是回归，那么可以关闭debug 选项，速度快很多。 在编译仿真中无效翻转对性能影响并不大，更多在于timescale debug 选项。...为了减少debug 选项使用，尽量不用uvm hdl 方法，改用其他方法。 编译现在是分块编译，但是分块需要满足一些划分或者coding 规则，否则会影响效率。...RTL 除了算法架构的考虑，还要考虑最后的实现，才是好的RTL.  对中后端友好，PPA 好的，具体来说就是，formal 容易过，对后端flow 友好，pr 实现相对简单。...总之，rtl如果能多考虑以后的时序问题，以后就会少麻烦，改流水线容易，改loop难。 前端写RTL 就像写C 的程序员，一对一翻译spec 在实践中不可能存在，除非是设计自己写的spec.

1.1K20

TDesign 更新周报（2022年11月第2周）

修复两侧全量勾选时报错的问题 @yaogengzhu (#1741)Input: 修复在输入框进行预渲染处于 display: none 状态时，宽度计算不正确的问题，issue#1678 @chaishi (#1749)Select...: @skytt (#1755) 修复创建项目在已有选项中存在时，重复显示的问题修复多选时，待创建选项显示样式问题优化键盘事件的逻辑ConfigProvider: 修复 t-config-provider...(issue #1961) @pengYYYYY (#1977)详情见：https://github.com/Tencent/tdesign-vue-next/releases/tag/0.24.6React...FixesTable: 当禁用resizable时，基础表格表头默认使用用户定义的列宽 @ZTao-z (#1662)Dropdown: 修复Children变化时没有重新渲染的异常 @uyarn (#1673)Select...TreeSelect: 修复 valueDisplay 和 filterable 同时设置时的显示问题 @moecasts (#1674)详情见：https://github.com/Tencent/tdesign-react

1.5K20

最好用的 5 个 React select 多选下拉菜单组件测评推荐

分组全选 Multiselect React Dropdown - 多选搜索、固定选项、分组选项、默认必选 React Custom Flag Select - 手机号国际区号搜索下拉选择器 1.React...React Select 不仅组件代码简洁优雅，API 也非常友好，只要功能满足你，闭眼选它，不用担心出错 没有依赖 单选、多选、标记 自定义选项模板 下拉菜单 过滤及搜索建议 基本组件和对自定义组件的支持...虽然 UI 简单，但整体轻盈，功能有十分丰富，默认显示复选框，能够对多选项进行分组，支持在一行中显示多个选项，按组全选。...、键盘快捷键、UI 漂亮 [3react-select-search] react-select-search 是一款主打搜索的 React 下拉菜单选择器，轻量级、零依赖，有非常强大的搜索过滤功能，异步选项...扩展阅读：《6款适合国内场景的 React admin 后台管理框架测评》 5.Multiselect React Dropdown - 多选搜索、固定选项、分组选项、默认必选 [5multiselect-react-dropdown

7K30

独立开发者必备的29个开源React后台管理模板

Admin Template Gogo具有良好的设计、质量代码和对细节的关注相结合的。...对组件、布局、应用程序和主题的其他部分使用了相同的设计语言。...Skote是一个制作精美、干净和设计最小的管理模板，具有带有RTL选项的深色、浅色布局。...如果您是一名开发人员，并且正在寻找一个最小的管理仪表板，该仪表板完全响应Bootstrap和React、Redux、Saga，没有jQuery，那么您就来对使用Skote-React管理仪表板模板开始您的项目了...Xtreme React Admin基于模块化设计，为用户提供了简单的定制选项，并允许轻松构建。模板的框架允许实现现代应用程序的复杂要求，这使其对用户非常有利。

3K10

Vitis指南 | Xilinx Vitis 系列（二）

从全局内存库到这些内存接口的连接是可配置的，因为它们的功能由内核编译选项确定。 可以在Xilinx器件的PL中实现多个内核，从而大大加快了应用程序的速度。单个内核也可以被实例化多次。...内核的实例数量是可编程的，并且由构建FPGA二进制文件时指定的链接选项确定。有关指定这些选项的更多信息，请参阅链接内核。...内核软件要求 RTL内核具有与C / C ++和OpenCL内核相同的软件接口模型。在宿主程序中，它们被视为具有无效返回值，指针参数和标量参数的函数。...如果RTL设计具有不同的执行模型，则必须对其进行调整以确保其将以这种方式运行。 打断 RTL内核可以选择具有一个包含单个中断的中断端口。端口名称必须被调用interrupt并且为高电平有效。...4.3.4 摘要 本节总结了RTL内核IP的VLNV，软件功能原型和从上一页中选择的选项创建的硬件控制寄存器。函数原型传达了如果是C函数的内核调用的样子。

1.8K20

如何快速查找目标cell

通常，Vivado综合后的结果是以层次化方式显示的，这种层次化方式和设计输入阶段的RTL代码层次基本吻合。因此，对于设计者而言，了解原始RTL代码的层次结构有助于查找cell。...这里，选项-hier的目的是层次化寻找。同时，还可以看到Vivado的命名特征：对于寄存器，综合后的名字是在原有名字后添加“_reg”。...技巧2： 如果已知一个对象的全名，在Tcl console中获得该对象，并执行select_objects，然后按下F4，则可显示该对象的Schematic视图。具体操作如下图所示。 ?...这是因为-hier和层次表示符不能同时使用，但可以在选项-filter中使用，如上图所示的那样。 ? 思考一下，根据上述方法， 1....如果要找到指定模块下的所有DSP48对应的cell，应采用什么样的命令？ 4. 如果要找到指定模块下的所有时序单元对应的cell，应采用什么样的命令？

2.3K24
点击加载更多

扫码

添加站长 进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

更多标签

活动推荐

    运营活动

    活动名称
    广告关闭

    腾讯云开发者

    扫码关注腾讯云开发者

    扫码关注腾讯云开发者

    领取腾讯云代金券

    热门产品

    热门推荐

    更多推荐

    Copyright © 2013 - 2024 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

    深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

    腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

    领券