ref(toolbar): re-wrap buttons for torture tests

The inline classes for the toolbars were re-arranged
to fix non-rounded corners in the always-on-top window's
toolbar. However, those classes were also used by the
torture tests as a way to find stable elements that will
not get blown away by a react re-render. So re-wrap the
buttons with a div that will not get blown away,
add back the inline classes to those divs, and change
the CSS to round the corners in the always-on-top
window's toolbar.
This commit is contained in:
Leonard Kim 2017-12-26 12:28:32 -08:00 committed by Дамян Минков
parent 6146c12533
commit e217c172f8
3 changed files with 9 additions and 2 deletions

View File

@ -153,10 +153,13 @@
@include transform(translateX(-50%));
> a:first-child.button,
> div:first-child .button {
border-bottom-left-radius: 3px;
border-top-left-radius: 3px;
}
> a:last-child.button,
> div:last-child .button {
border-bottom-right-radius: 3px;
border-top-right-radius: 3px;

View File

@ -96,7 +96,7 @@ export default class StatelessToolbarButton extends AbstractToolbarButton {
const attributes = getButtonAttributesByProps(button);
return (
<div className = { `toolbar-button-wrapper ${button.id}-wrapper` }>
<div className = 'toolbar-button'>
<a
{ ...attributes }
onClick = { this._onClick }>

View File

@ -140,7 +140,11 @@ class ToolbarButton extends Component<*> {
);
}
return children;
return (
<div className = { `toolbar-button-wrapper ${button.id}-wrapper` }>
{ children }
</div>
);
}
/**