DS-579 Header Height HTML Attribute

[MarcinMr]

Jira

https://pegadigitalit.atlassian.net/browse/DS-579

Summary

A data-header-height attr was added to the <header />

Details

• The height of the bolt-page-header component is added to the data-header-height attr
• The data-header-height attr updates on resizing when the height of the header changes

How to test

Pull the branch. Check if data-header-height attr is added properly to the bolt-page-header component. Check if this attr updates when the component's height changes on window resize.

Release notes

data-header-height attribute is added to the bolt-page-header componenet.

[danielamorse]

Looks great! Approved.

I added the optimized-resize import. throttledResize worked because this dependency was already imported by some other components, but we should also import it here so that each package's dependencies are made explicit. Webpack will dedupe them.

When we start actually using this new data attribute, we may or may not want to switch to getBoundingClientRect() to get the height*, but it's too soon to say. For now clientHeight is a good choice.

*getBoundingClientRect() will return a fraction which can be used in a calculation with other fractions. If the header height is already rounded to an integer it may result in sub-pixel rounding issues, e.g. creating a 1px gap between the header and the sticky element we're trying to position.

[danielamorse]

Added optimized-resize import. That's where throttledResize comes from.