ipywidgets

ipywidgets copied to clipboard

Description

Hi,

I am trying to implement a custom front-end for a Jupyter kernel session, based on the HTML Manager library and taking cues from the web examples in this repo. However, I have found that widget layouts that involve Tab don't seem to work quite as well as they do when rendering inside JupyterLab.

Reproduce

Here is some example code (reduced from a more complex real-world case):

import ipywidgets as widgets
from ipywidgets import Layout


tab = widgets.Tab(layout=Layout(flex='1'))
widgets.HBox([tab], layout=Layout(width='100%'))

When this is executed inside JupyterLab, the rendered result correctly applies the flex: 1 attribute to the tab element, so that the tab widget can occupy the full width of the HBox:

When running this outside JupyterLab, such as in my custom front-end, in a simple setup with the HTML Manager AMD template, or via this repo's web3 example, this inline style attribute is not applied to the tab:

(Note that the parent HBox's 100% width is applied correctly in both cases)

Expected behavior

It should be possible to apply Layout options to the Tab widget in any environment.

Context

I tried to debug this a little myself, but didn't get that far. It seems like the LayoutModel gets created correctly for both the HBox and the Tab, but I don't think setLayout is called on the outer tab container for some reason. What stumps me is why this works OK in JupyterLab.

Apologies if this is due to user error!