11

I would like to get the height of the viewable screen in Lightning Dektop version as well as in Salesforce1 app.

I'm able to retrieve the window height by using $(window).height();.

But I am not able to retrieve the default header height using $("#oneHeader").height(); when Locker Service is active probably because of the "component/namespace encapsulation". (Currently I subtract the header height from window height to get the viewable screen height)

Screenshot

Is there anyway to get the viewable screen size so that I can ensure my component does not go outside the viewable screen size (irrespective of the screen size)?

  • Did you find any solution for reading height with Locker Service? – VarunC Jun 14 '18 at 12:06
  • Any solution or workaround here? – manish keer Apr 21 at 15:32
2

I've been experimenting with something similar. You can create a component v39.0 and use it to tee up certain things outside the locker service.

cmp

<aura:component >
    <aura:attribute name="headerHeight" type="Object" />
    <aura:handler name="init" value="{!this}" action="{!c.doInit}" />

</aura:component>

controller:

doInit : function(component, event, helper) {
    component.set('v.headerHeight', window.document.getElementById('oneHeader').getBoundingClientRect().height);
}

then include that in your main cmp

<c:portal aura:id="portal" />

then

cmp.find('portal').get('v.headerHeight')

I've tinkered around with just storing the window or the element, but the lockerservice is smart enough to serve up the SecureWindow still.

You could expose a function from the 39 component that did evals, then use it something like:

cmp.find('portal').dangerousEval("window.getElementById...", function(theResultOfAnEval){...});

but that seems pretty dangerous

  • 1
    You will run into CSP issues with the eval approach. Also, if there is even one component that is version 39, you will fail the security review, as all components must be version 40. – Robert Sussland Jul 12 '17 at 16:32
  • 2
    Yeah, I understand. This is a valid use case, and I'll ping some of the Locker devs to see if they have any ideas. – Robert Sussland Jul 12 '17 at 16:57
  • @RobertSussland That would be of immense help. Thank you wellmstein and RobertSussland. – SE_User Jul 13 '17 at 5:28
  • 1
    Hello... has there been any resolution reached on how we read the height in lightning component with Locker Service? – VarunC Jun 14 '18 at 12:06

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.