Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
40 changed files
with
1,868 additions
and
188 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
import React from 'react'; | ||
|
||
module.exports = () => <span />; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
let itemMocks = {}; | ||
|
||
module.exports = { | ||
__setItemMocks: mocks => { | ||
itemMocks = mocks; | ||
}, | ||
getItem: jest.fn(itemKey => Promise.resolve(itemMocks[itemKey])), | ||
setItem: jest.fn(() => Promise.resolve()), | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
22 changes: 22 additions & 0 deletions
22
...s-component-playground/src/components/ComponentPlayground/__fixtures__/selected-editor.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
export default { | ||
props: { | ||
loaderUri: '/mock/loader/index.html', | ||
router: { | ||
goTo: url => console.log('go to', url), | ||
routeLink: e => { | ||
e.preventDefault(); | ||
console.log('link to', e.currentTarget.href); | ||
}, | ||
}, | ||
component: 'ComponentA', | ||
fixture: 'foo', | ||
editor: true, | ||
}, | ||
state: { | ||
waitingForLoader: false, | ||
fixtures: { | ||
ComponentA: ['foo', 'bar'], | ||
ComponentB: ['baz', 'qux'], | ||
}, | ||
}, | ||
}; |
46 changes: 46 additions & 0 deletions
46
...onent-playground/src/components/ComponentPlayground/__tests__/fixture-editor/controls.jsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,46 @@ | ||
import React from 'react'; | ||
import { mount } from 'enzyme'; | ||
import { Loader } from 'react-cosmos-loader'; | ||
import createStateProxy from 'react-cosmos-state-proxy'; | ||
import selectedEditorFixture from '../../__fixtures__/selected-editor'; | ||
import DragHandle from '../../../DragHandle'; | ||
import ComponentPlayground from '../../'; | ||
|
||
// Vars populated in beforeEach blocks | ||
let wrapper; | ||
|
||
describe('Fixture editor controls', () => { | ||
// Fixture editor is already on so the button will untoggle it | ||
const fixtureEditorUrl = '/?component=ComponentA&fixture=foo'; | ||
|
||
beforeEach(() => { | ||
return new Promise(resolve => { | ||
// Mount component in order for ref and lifecycle methods to be called | ||
wrapper = mount( | ||
<Loader | ||
proxies={[createStateProxy]} | ||
component={ComponentPlayground} | ||
fixture={selectedEditorFixture} | ||
onComponentRef={resolve} | ||
/> | ||
); | ||
}); | ||
}); | ||
|
||
it('should set untoggle URL to fixture editor button', () => { | ||
expect(wrapper.find(`.header a[href="${fixtureEditorUrl}"]`).length).toBe( | ||
1 | ||
); | ||
}); | ||
|
||
it('should render selected fixture editor button', () => { | ||
expect( | ||
wrapper.find(`.header a[href="${fixtureEditorUrl}"].selectedButton`) | ||
.length | ||
).toBe(1); | ||
}); | ||
|
||
it('should render DragHandle in fixture editor pane', () => { | ||
expect(wrapper.find('.fixtureEditorPane').find(DragHandle).length).toBe(1); | ||
}); | ||
}); |
121 changes: 121 additions & 0 deletions
121
...mponent-playground/src/components/ComponentPlayground/__tests__/fixture-editor/editor.jsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,121 @@ | ||
import React from 'react'; | ||
import { mount } from 'enzyme'; | ||
import { Loader } from 'react-cosmos-loader'; | ||
import createStateProxy from 'react-cosmos-state-proxy'; | ||
import selectedEditorFixture from '../../__fixtures__/selected-editor'; | ||
import FixtureEditor from '../../../FixtureEditor'; | ||
import ComponentPlayground from '../../'; | ||
|
||
// Vars populated in beforeEach blocks | ||
let messageHandlers; | ||
let wrapper; | ||
let loaderContentWindow; | ||
|
||
const handleMessage = e => { | ||
const { type } = e.data; | ||
if (!messageHandlers[type]) { | ||
throw new Error('Unexpected message event'); | ||
} | ||
messageHandlers[type](e.data); | ||
}; | ||
|
||
const waitForPostMessage = type => | ||
new Promise(resolve => { | ||
messageHandlers[type] = resolve; | ||
}); | ||
|
||
describe('Fixture editor', () => { | ||
beforeEach(() => { | ||
messageHandlers = {}; | ||
window.addEventListener('message', handleMessage, false); | ||
|
||
const onFixtureLoad = waitForPostMessage('fixtureLoad'); | ||
|
||
return new Promise(resolve => { | ||
// Mount component in order for ref and lifecycle methods to be called | ||
wrapper = mount( | ||
<Loader | ||
proxies={[createStateProxy]} | ||
component={ComponentPlayground} | ||
fixture={selectedEditorFixture} | ||
onComponentRef={resolve} | ||
/> | ||
); | ||
}).then(instance => { | ||
loaderContentWindow = { | ||
postMessage: jest.fn(), | ||
}; | ||
// iframe.contentWindow isn't available in jsdom | ||
instance.loaderFrame = { | ||
contentWindow: loaderContentWindow, | ||
}; | ||
|
||
window.postMessage( | ||
{ | ||
type: 'fixtureLoad', | ||
fixtureBody: { | ||
foo: 'bar', | ||
}, | ||
}, | ||
'*' | ||
); | ||
|
||
return onFixtureLoad; | ||
}); | ||
}); | ||
|
||
afterEach(() => { | ||
window.removeEventListener('message', handleMessage); | ||
}); | ||
|
||
it('sends initial fixture body as value to FixtureEditor', () => { | ||
expect(wrapper.find(FixtureEditor).prop('value')).toEqual({ | ||
foo: 'bar', | ||
}); | ||
}); | ||
|
||
describe('on fixture update from Loader', () => { | ||
beforeEach(() => { | ||
const onFixtureUpdate = waitForPostMessage('fixtureUpdate'); | ||
|
||
window.postMessage( | ||
{ | ||
type: 'fixtureUpdate', | ||
fixtureBody: { | ||
baz: 'qux', | ||
}, | ||
}, | ||
'*' | ||
); | ||
|
||
return onFixtureUpdate; | ||
}); | ||
|
||
it('sends updated fixture body as value to FixtureEditor', () => { | ||
expect(wrapper.find(FixtureEditor).prop('value')).toEqual({ | ||
foo: 'bar', | ||
baz: 'qux', | ||
}); | ||
}); | ||
}); | ||
|
||
describe('on fixture edit from editor', () => { | ||
beforeEach(() => { | ||
wrapper.find(FixtureEditor).prop('onChange')({ | ||
foo: 'baz', | ||
}); | ||
}); | ||
|
||
it('sends edited fixture body to Loader', () => { | ||
expect(loaderContentWindow.postMessage).toHaveBeenCalledWith( | ||
{ | ||
type: 'fixtureEdit', | ||
fixtureBody: { | ||
foo: 'baz', | ||
}, | ||
}, | ||
'*' | ||
); | ||
}); | ||
}); | ||
}); |
Oops, something went wrong.