Jest React Enzyme測試用例

Question

export default class StudentGrid extends Component {
  static handleScroll() {
    const studentTableHeader = document.getElementById('student-table-header');
    const studentTable = document.getElementById('student-table');
    const scrolldiv = document.getElementsByClassName('main')[0].scrollTop; // From DOM
    const sticky = studentTableHeader.offsetTop;
    if (scrolldiv >= sticky) {
      studentTableHeader.classList.add('studentList__sticky');
      studentTable.classList.add('studentList__managetop');
    } else {
      studentTableHeader.classList.remove('studentList__sticky');
      studentTable.classList.remove('studentList__managetop');
    }
  }

  componentDidMount() {
    window.addEventListener('scroll', StudentGrid.handleScroll, true);
  }

  componentWillUnmount() {
    window.removeEventListener('scroll', StudentGrid.handleScroll, true);
  }

  render() {
    return (
      <div className="pe-container-fill">
        <div className="responsive-table">
          <div className="table" id="student-table">
            <div
              className="table-row table__header"
              id="student-table-header"
            />
          </div>
        </div>
      </div>
    );
  }
}

幫我寫測試用例（使用Jest和Enzyme）
1.模擬滾動，需要調用handleScroll功能檢查
2.需要檢查類“ studentList__sticky”和“ studentList__managetop”是否存在。

Answer 1

您可以在此頁面上查看airbnb.io-enzyme / jest 。 您將必須了解淺的，完整的dom和靜態渲染。 這對於您理解Jest和Enzyme的測試過程將非常有用。

您可以查看hackernoon.com-酶/開玩笑 。 這將顯示並解釋一些測試用例。