Skip to main content

· 3 min read
Ruihua Niu
cover image

Overview

When using getByRole from react-testing-library to retrieve the component/element content, it should be quite straightforward, but when the component/element is wrapped with the Tooltip component from Material UI, something weird happen: getByRole can only get the content of the tooltip rather than the component/element content. This article is going to explain why such issue happen and how to fix it.

· 3 min read
Ruihua Niu
cover image

Overview

Creating a heatmap chart in Echarts typically involves utilizing the series.data property in conjunction with the xAxis.data and yAxis.data properties. However, this method often requires many data manipulation and lacks flexibility. This article sets out to investigate an alternative approach to crafting more adaptable and potent heatmap charts in Echarts with React, a technique not covered in the official documentation.

· 2 min read
Ruihua Niu
cover image

Overview

Passing props to components in React is a commonplace practice, yet it differs when passing props to children component. While one approach involves using the cloneElement and/or Children API to manipulate and transform the JSX received as the children prop, this method presents certain pitfalls, and those two APIs are legacy. This article aims to explore alternative, more effective methods to attain the same outcome.

· 2 min read
Ruihua Niu
cover image

WebSocket is a new technology coming with HTML5, and the first time I saw it, it confused me with REST API. So in this article, the following questions will be answered.

  • What is REST API?
  • What is WebSocket?
  • What is the connection and difference?

· 2 min read
Ruihua Niu
cover image

I have done projects with normal CSS, SASS, and also a project with styled components, but haven't done any project with CSS modules.

As I'm going to do a new project, and considering the issues I met in styled components, I'm considering the possibility using CSS modules. So here comes this post.

Things below need to be cleared?

  • What is styled components and why is it?

· 4 min read
Ruihua Niu
cover image

Since I have met the CORS issues for a while and this time I got stuck with it during the development of the real commercial project.

I got to do some research to make it clear.

Things below need to be cleared:

  • What is CORS?