Skip to content

Commit

Permalink
test(platform): assemble_space : begin test Publish
Browse files Browse the repository at this point in the history
add useState to service;

note:
test Modal snapshot error: parentInstance.children.indexOf is not a function

refer to:
reactjs/react-modal#553
https://medium.com/@amanverma.dev/mocking-create-portal-to-utilize-react-test-renderer-in-writing-snapshot-uts-c49773c88acd

this is react-test-renderer's bug that the Modal use createPortal and cause the error!
so not test Modal snapshot!
  • Loading branch information
yyc-git committed Sep 6, 2022
1 parent 8acf822 commit 53d68de
Show file tree
Hide file tree
Showing 10 changed files with 133 additions and 2 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,10 @@ open FrontendUtils.Antd
open FrontendUtils.AssembleSpaceType

module Method = {
let clickPublishButton = setVisible => {
setVisible(_ => true)
}

let onFinish = (
service,
setVisible,
Expand Down Expand Up @@ -62,12 +66,12 @@ module Method = {
let make = (~service: service, ~username: option<string>) => {
let (selectedExtensions, selectedContributes) = service.react.useSelector(Method.useSelector)

let (visible, setVisible) = React.useState(_ => false)
let (visible, setVisible) = service.react.useState(_ => false)

<>
<Button
onClick={_ => {
setVisible(_ => true)
Method.clickPublishButton(setVisible)
}}>
{React.string(`发布`)}
</Button>
Expand Down
17 changes: 17 additions & 0 deletions platform/assemble-space/test/features/publish.feature
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
Feature: Publish
As a Publish
I want to publish app
So that I can use it

Background: prepare
Given prepare sandbox
And prepare snapshot

Scenario: show publish button
When render Publish
Then should show publish button

# Scenario: show modal after click publish button
# When render Publish
# And click publish button
# Then should show modal
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Publish show publish button 1`] = `
<button
className="ant-btn ant-btn-default"
disabled={false}
onClick={[Function]}
type="button"
>
<span>
发 布
</span>
</button>
`;
82 changes: 82 additions & 0 deletions platform/assemble-space/test/step-definitions/publish.steps.res
Original file line number Diff line number Diff line change
@@ -0,0 +1,82 @@
open Meta3dBsJestCucumber
open Cucumber
open Expect
open Operators

open Sinon

let feature = loadFeature("./test/features/publish.feature")

defineFeature(feature, test => {
let sandbox = ref(Obj.magic(1))

// let _prepare = (given, \"and", initialState, store) => {
let _prepare = (given, \"and") => {
given("prepare sandbox", () => {
sandbox := createSandbox()
})

\"and"("prepare snapshot", () => {
ReactTestTool.prepare()
})
}

test(."show publish button", ({given, \"when", \"and", then}) => {
_prepare(given, \"and")

\"when"("render Publish", () => {
()
})

then("should show publish button", () => {
PublishTool.buildUI(
~sandbox,
~service=ServiceTool.build(
~sandbox,
~useSelector=createEmptyStub(refJsObjToSandbox(sandbox.contents))->returns(
(list{}, list{}),
_,
),
(),
),
(),
)
->ReactTestRenderer.create
->ReactTestTool.createSnapshotAndMatch
})
})

// test(."show modal after click publish button", ({given, \"when", \"and", then}) => {
// _prepare(given, \"and")

// \"when"("render Publish", () => {
// ()
// })

// \"and"("click publish button", () => {
// ()
// })

// then("should show modal", () => {
// let component =
// PublishTool.buildUI(
// ~sandbox,
// ~service=ServiceTool.build(
// ~sandbox,
// ~useState=createEmptyStub(refJsObjToSandbox(sandbox.contents))->returns(
// (true, _ => true),
// _,
// ),
// ~useSelector=createEmptyStub(refJsObjToSandbox(sandbox.contents))->returns(
// (list{}, list{}),
// _,
// ),
// (),
// ),
// (),
// )
// ->ReactTestRenderer.create
// ->ReactTestTool.createSnapshotAndMatch
// })
// })
})
3 changes: 3 additions & 0 deletions platform/assemble-space/test/tool/PublishTool.res
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
let buildUI = (~sandbox, ~username=None, ~service=ServiceTool.build(~sandbox, ()), ()) => {
<Publish service username />
}
4 changes: 4 additions & 0 deletions platform/assemble-space/test/tool/ReactHookTool.res
Original file line number Diff line number Diff line change
Expand Up @@ -9,3 +9,7 @@ let getValue = (~setLocalValueStub, ~callIndex=0, ()) => {
->Meta3dCommonlib.OptionSt.getExn
)()
}

let buildEmptySetStateFunc = () => {
() => ()
}
2 changes: 2 additions & 0 deletions platform/assemble-space/test/tool/ServiceTool.res
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ open Sinon
let build = (
~sandbox,
~dispatch=createEmptyStub(refJsObjToSandbox(sandbox.contents)),
~useState=React.useState->Obj.magic,
~useSelector=createEmptyStub(refJsObjToSandbox(sandbox.contents)),
~useEffectOnce=createEmptyStub(refJsObjToSandbox(sandbox.contents)),
~useEffectOnceAsync=createEmptyStub(refJsObjToSandbox(sandbox.contents)),
Expand All @@ -25,6 +26,7 @@ let build = (
(),
) => {
react: {
useState: useState->Obj.magic,
useDispatch: () => dispatch,
useSelector: useSelector->Obj.magic,
useEffectOnce: useEffectOnce,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ type backendService = {
}

type reactService = {
useState: 'a. ('a => 'a) => ('a, ('a => 'a) => unit),
useDispatch: useDispatch,
useSelector: 'a. (AssembleSpaceStoreType.state => 'a) => 'a,
useEffectOnce: (unit => (unit, option<unit => unit>)) => unit,
Expand Down
1 change: 1 addition & 0 deletions platform/frontend-utils/src/externals/antd/Antd__Modal.res
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ type fn = unit => unit
@module("antd") @react.component
external make: (
~title: string=?,
// ~\"open": bool=?,
~visible: bool=?,
~onOk: fn=?,
~onCancel: fn=?,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,9 @@ let make = () => {
error: (. e, durationOpt) => FrontendUtils.ErrorUtils.error(e, durationOpt),
},
react: {
useState: func => {
React.useState(func->Obj.magic)
},
useSelector: func => {
AppStore.useSelector(({assembleSpaceState}: AppStore.state) => {
func(assembleSpaceState)
Expand Down

0 comments on commit 53d68de

Please sign in to comment.