?????????????“???????”?е????????????????????????????????е???????????????????????????????????????????????????????????????????
????????????
?????????TDD????????????????????????“???????”????????Щ?????????????????????????????????磬??????????????????
???????????????????Ajax??localStorage????IndexedDB????????????????????????????????????Щ?????????????????????????????mock??Щ????????????????Щ???????????“???????”???????????????“???????”?????????????????????????“???????”???????
??????????????Щ?????????????“???????”????????????????????????????в???????????????????????????????????????mock????????е???????????
??????????????????????????????Ajax????????I/O???????м??????????????mock??????????????????????????????????????????????????flaky?????????????????????????????????????????????м??????????????????????????????????????????????????mock????Щ??
????????????????У??????????????I/O?????DOM??????Ajax???????????????????????
????mock DOM
???????????????????????????????????mockDOM???????????????????????????????DOM????????????????????????????DOM??ζ?????????????????????ζ?????????????????????????
?????????????????????????DOM??????????????????????????????????????????????????á??????????????????jsdom?????????????????????????????????NodeJS??????DOM??
?????????????????????????Node??????????JSDom??????????DOM????I/O????????????????????????DOM?????????????з?????????????????????м?????????????????????JSDom?????????????????????Node??????????????????
?????????????????????????????????????????г????????????????????????????????????????????????????????????
???????
???????????????????????????????????????????????????????React?????React???????????????????????????????ν??????????????????????????????к????????????????????????????к???????????????
?????????????????????React??????????????????React????????????????????￡???????????jsdom????????????????????е?????????
????ok????????????
???????Jsdom

constReact=require('react')
conste=React.createElement
constReactDom=require('react-dom')
constCalculatorApp=require('../../lib/calculator-app')
...
describe('calculatorappcomponent'??function(){
...
it('shouldwork'??function(){
ReactDom.render(e(CalculatorApp)??document.getElementById('container'))
constdisplayElement=document.querySelector('.display')
expect(displayElement.textContent).to.equal('0')

constReact=require('react')
conste=React.createElement
constReactDom=require('react-dom')
constCalculatorApp=require('../../lib/calculator-app')
...
describe('calculatorappcomponent'??function(){
...
it('shouldwork'??function(){
ReactDom.render(e(CalculatorApp)??document.getElementById('container'))
constdisplayElement=document.querySelector('.display')
expect(displayElement.textContent).to.equal('0')
?????????10–14?У?????render??CalculatorApp???????????????render??Display??Keypad????12??14?в?????DOM?м???????????????0??????????￡???
???????????????????????Node?μ??????????????document??????????????????????????????document????????????????????????????NodeJS?С??????????д?????????????????????????Щjsdom???????????????????????????????????????????лDomenicDenicola??ElijahInsua?????????????????????????

??????10??????????document??????ReactDom??????????????ReactDom????????????????????????????Щ???????????????д???????????????
before(function(){
global.document=jsdom(`<!doctypehtml><html><body><divid="container"/></div></body></html>`)
global.window=document.defaultView
})
after(function(){
deleteglobal.window
deleteglobal.document
})
   ?????д????????????document???????????????????????div????????????????window???????????????????????React?????????after??????????????
????document??window???????ó?????????????????????????????????????????????????????????????????????????????????????????????У??????ava?????????????????????????д??????????????????
????????????????????ó??????React??ReactDOM???document??window??????????????????????????????????????Reactfiber????????????????????????????????????document??window???ó??????
???????????
??????μ??????????д????????????
????
ReactDom.render(e(CalculatorApp)??document.getElementById('container'))
constdisplayElement=document.querySelector('.display')
expect(displayElement.textContent).to.equal('0')
constdigit4Element=document.querySelector('.digit-4')
constdigit2Element=document.querySelector('.digit-2')
constoperatorMultiply=document.querySelector('.operator-multiply')
constoperatorEquals=document.querySelector('.operator-equals')
digit4Element.click()
digit2Element.click()
operatorMultiply.click()
digit2Element.click()
operatorEquals.click()
expect(displayElement.textContent).to.equal('84')
?????????????????????????“42*2=”?????????????“84”????????element?????????????querySelector????????????click???????????????????????????????????????
varev=newEvent("keyup"??...);
document.dispatchEvent(ev);
???????????????click???????????????????ú?????????????
???????????????????????????????????????????????????????????????????????10?????????????????????????????????????д???????????á?
????????????????????????????в???????????????????????????????????????????????????????????????????????в?????????????????????????У??????????????????????????????в????????????????????????10?????????????????????м?????????????????????????????в????
???????
???????????????????????
?????????????jsdom??????????????document??window??
????????????????jsdom????????
????????????????????????