Commit f2c5e49e authored by Lyza Danger Gardner's avatar Lyza Danger Gardner Committed by Lyza Gardner

Publish `sidebarLayoutChanged` event

parent 5ced2dce
...@@ -166,10 +166,6 @@ export default class Sidebar extends Host { ...@@ -166,10 +166,6 @@ export default class Sidebar extends Host {
* opposed to being resized via the sidebar's drag handles * opposed to being resized via the sidebar's drag handles
*/ */
_notifyOfLayoutChange(expanded) { _notifyOfLayoutChange(expanded) {
if (!this.onLayoutChange) {
return;
}
// The sidebar structure is: // The sidebar structure is:
// //
// [ Toolbar ][ ] // [ Toolbar ][ ]
...@@ -179,7 +175,7 @@ export default class Sidebar extends Host { ...@@ -179,7 +175,7 @@ export default class Sidebar extends Host {
// The sidebar iframe is hidden or shown by adjusting the left margin of // The sidebar iframe is hidden or shown by adjusting the left margin of
// its container. // its container.
const toolbarWidth = this.toolbarWidth || 0; const toolbarWidth = (this.frame && this.toolbar.getWidth()) || 0;
const frame = this.frame || this.externalFrame; const frame = this.frame || this.externalFrame;
const rect = frame[0].getBoundingClientRect(); const rect = frame[0].getBoundingClientRect();
const computedStyle = window.getComputedStyle(frame[0]); const computedStyle = window.getComputedStyle(frame[0]);
...@@ -206,11 +202,16 @@ export default class Sidebar extends Host { ...@@ -206,11 +202,16 @@ export default class Sidebar extends Host {
expanded = frameVisibleWidth > toolbarWidth; expanded = frameVisibleWidth > toolbarWidth;
} }
this.onLayoutChange({ const layoutState = {
expanded, expanded,
width: expanded ? frameVisibleWidth : toolbarWidth, width: expanded ? frameVisibleWidth : toolbarWidth,
height: rect.height, height: rect.height,
}); };
if (this.onLayoutChange) {
this.onLayoutChange(layoutState);
}
this.publish('sidebarLayoutChanged', [layoutState]);
} }
_onPan(event) { _onPan(event) {
......
...@@ -494,14 +494,22 @@ describe('Sidebar', () => { ...@@ -494,14 +494,22 @@ describe('Sidebar', () => {
}); });
it('notifies when sidebar changes expanded state', () => { it('notifies when sidebar changes expanded state', () => {
sinon.stub(sidebar, 'publish');
sidebar.show(); sidebar.show();
assert.calledOnce(layoutChangeHandlerSpy); assert.calledOnce(layoutChangeHandlerSpy);
assert.calledOnce(sidebar.publish);
assert.calledWith(
sidebar.publish,
'sidebarLayoutChanged',
sinon.match.any
);
assertLayoutValues(layoutChangeHandlerSpy.lastCall.args[0], { assertLayoutValues(layoutChangeHandlerSpy.lastCall.args[0], {
expanded: true, expanded: true,
}); });
sidebar.hide(); sidebar.hide();
assert.calledTwice(layoutChangeHandlerSpy); assert.calledTwice(layoutChangeHandlerSpy);
assert.calledTwice(sidebar.publish);
assertLayoutValues(layoutChangeHandlerSpy.lastCall.args[0], { assertLayoutValues(layoutChangeHandlerSpy.lastCall.args[0], {
expanded: false, expanded: false,
width: fakeToolbar.getWidth(), width: fakeToolbar.getWidth(),
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment