I am working on a requirement to develop a lightning component to display

1. objects list as lightning:tree in left pane and
2. fields list as lightning:table in right pane as shown in below image

Actual Issue: How to display scrollbar on lightning tree/table on devices responsive to device size.
More details below:
I am not sure what is best practice to display Scrollbar when more records need to be displayed in tree and table.
Somehow I am able to display scrollbar but it seems wont work on all screen sizes. I have placed tree and table inside div with specific height
Component code

<ltng:require styles="{!$Resource.HideAppPageHeader}"/> <!--Declare Attributes--> <!--Objects Available Table --> <aura:attribute name="objList" type="Object[]"/> <aura:attribute name="filteredObjList" type="Object[]"/> <aura:attribute name="mycolumns" type="List"/> <aura:attribute name="treeItems" type="Object[]" /> <aura:attribute name="filteredTreeItems" type="Object[]" /> <aura:attribute name="searchText" type="string" default=""/> <aura:attribute name="objectTypes" type="String[]" default="['Custom', 'Standard', 'Both']" /> <aura:attribute name="objTypeValue" type="String" default="Both"/> <aura:attribute name="selectionTypes" type="String[]" default="['Selected', 'Not Selected', 'All']" /> <aura:attribute name="selTypeValue" type="String" default="All"/> <aura:attribute name="fields" access="public" type="Object[]"/> <aura:attribute name="filteredFields" access="public" type="Object[]"/> <aura:attribute name="fieldColumns" type="List"/> <aura:attribute name="selectedFields" type="List"/> <!--Declare Handler--> <aura:handler name="init" value="{!this}" action="{!c.doInit}"/> <div class="slds-grid slds-gutters_direct-xxx-small slds-scrollable--x slds-scrollable--y"> <div class="slds-col slds-size_1-of-5" style="background-color:white;"> <div class="slds-p-around_xxx-small"> <ui:inputText aura:id="textinput" keyup="{!c.searchOnKeyUp}" updateOn="keyup" value="{!v.searchText}" placeholder="Search" /> </div> <fieldset class="slds-form-element slds-p-around_xxx-small"> <div class="customRadioCls"> <aura:iteration items="{!v.objectTypes}" var="item"> <span class="slds-radio"> <input type="radio" id="{!item}" name="objradiogroup" onchange="{!c.handleObjTypeRG}" value="{!item}" checked="{!(v.objTypeValue==item)?'checked':''}"/> <label class="slds-radio__label" for="{!item}"> <span class="slds-radio_faux"></span> <span class="slds-form-element__label">{!item}</span> </label> </span> </aura:iteration> </div> </fieldset> <fieldset class="slds-form-element slds-p-around_xxx-small"> <div class="customRadioCls"> <aura:iteration items="{!v.selectionTypes}" var="item1"> <span class="slds-radio"> <input type="radio" id="{!item1}" name="selradiogroup" onchange="{!c.handleSelTypeRG}" value="{!item1}" checked="{!(v.selTypeValue==item1)?'checked':''}"/> <label class="slds-radio__label" for="{!item1}"> <span class="slds-radio_faux"></span> <span class="slds-form-element__label">{!item1}</span> </label> </span> </aura:iteration> </div> </fieldset> **<div style="height: 400px;overflow: auto;">** <!-- <div class="slds-scrollable slds-p-around_xxx-small" style="height: 430px; background-color:white ;"> --> <lightning:tree items="{! v.filteredTreeItems }" onselect="{!c.handleObjectSelect}"/> <!-- </div> --> </div> </div> <div class="slds-col slds-size_4-of-5"> **<div style="height: 500px;overflow: auto;">** <!--<div class="slds-scrollable" style="height: 500px; background-color:white ;">--> <lightning:datatable data="{!v.filteredFields}" columns="{!v.fieldColumns}" keyField="value" selectedRows="{!v.selectedFields}"/> <!-- </div> --> </div> </div> </div>

Only Tree and Table tags code snippet from above code:

</fieldset> <div style="height: 400px;overflow: auto;"> <!-- <div class="slds-scrollable slds-p-around_xxx-small" style="height: 430px; background-color:white ;"> --> <lightning:tree items="{! v.filteredTreeItems }" onselect="{!c.handleObjectSelect}"/> <!-- </div> --> </div> </div> <div class="slds-col slds-size_4-of-5"> <div style="height: 500px;overflow: auto;"> <!--<div class="slds-scrollable" style="height: 500px; background-color:white ;">--> <lightning:datatable data="{!v.filteredFields}" columns="{!v.fieldColumns}" keyField="value" selectedRows="{!v.selectedFields}"/> <!-- </div> --> </div>

Can you please help on below issues:
If I don't mention height in div, the table is not displaying all records. I have commented div tags with height: The tree and table are displayed as below. No scrollbar and no way to see all records in tree and table

<!-- <div style="height: 400px;overflow: auto;"> --> <!-- <div class="slds-scrollable slds-p-around_xxx-small" style="height: 430px; background-color:white ;"> --> <lightning:tree items="{! v.filteredTreeItems }" onselect="{!c.handleObjectSelect}"/> <!-- </div> --> <!-- </div> --> </div> <div class="slds-col slds-size_4-of-5"> <!-- <div style="height: 500px;overflow: auto;"> --> <!--<div class="slds-scrollable" style="height: 500px; background-color:white ;">--> <lightning:datatable data="{!v.filteredFields}" columns="{!v.fieldColumns}" keyField="value" selectedRows="{!v.selectedFields}"/> <!-- </div> --> <!-- </div> -->

If I mention more height than the height of screen, I can see scrollbar but, it is not showing the records at end of the scroll as it is outside of maximum height of screen. see the image below

<div style="height: 500px;overflow: auto;"> <!-- <div class="slds-scrollable slds-p-around_xxx-small" style="height: 430px; background-color:white ;"> --> <lightning:tree items="{! v.filteredTreeItems }" onselect="{!c.handleObjectSelect}"/> <!-- </div> --> </div> </div> <div class="slds-col slds-size_4-of-5"> <div style="height: 700px;overflow: auto;"> <!--<div class="slds-scrollable" style="height: 500px; background-color:white ;">--> <lightning:datatable data="{!v.filteredFields}" columns="{!v.fieldColumns}" keyField="value" selectedRows="{!v.selectedFields}"/> <!-- </div> --> </div>

I need clarifications on below queries as well:
what is the best way to display lightning table and lightning tree in lightning components so that it works well on all screens
How can I display lightning tree/table whole height on screen. Assuming that tree/table has 1000 items/rows, and show 1000 items/rows one time. without scroll bar, but page with height equla or more than tree/table height. I guess this is one of method to make it work on all devices. In my requirement, I dont expect elements more than 1000.
One more point, I have added this lightning component to Lightning App Page.

Aura Component and JS Controller and Helper files are not resolving the API names of custom object  and custom fields

In one of our Partner Dev Org, I am working on an application, after development and testing, I created a managed package

The steps I followed:

• Developed code(Aura components, Apex Controllers) and created custom objects
• After testing, Created unmanaged package and deployed in sandboxes and tested and working fine. 
  • Observed that Lightning component with lightning datatable is displaying data in all columns
• Created managed released package by defining namespace and also chosing the above already tested unmanaged package. It created managed package successfully
  •  Observed Lightning component with lightning datatable is not displaying data in non of columns
  • It even didn't work in Package Development Org(Partner Dev Org)
  • It didnt work in subscriber org

I am able to locate and find the root cause of the issue after spending 4 hours today:
The root cause is: 
Aura Component and JS Controller and Helper files are not resolving the API names of custom object  and custom fields

Sample Code blocks from Application Code:

Component

<aura:attribute name="addrList" access="global" type="Account_Address__c[]"/>
<aura:attribute name="filteredAddrList" access="global" type="Account_Address__c[]"/>

 

<lightning:datatable data="{!v.filteredAddrList}"                              
                             class="slds-m-top_medium"    
                             columns="{!v.columns}"                             
                             keyField="addressUniqueNumber__c"  
                             selectedRows="{!v.existingAddresses}"
                             sortedBy="{!v.sortedBy}"
                             sortedDirection="{!v.sortedDirection}"
                             onrowaction="{!c.navToMap}"
                             onrowselection="{!c.rowSelection}"
                             onsort="{!c.updateColumnSorting}" />

Javascript Controller and Helper code:
 

var actions = [
            { label: 'Details', name: 'show_details' }
        ]; 
        component.set('v.columns', [    
            {label:'Street', fieldName: 'Street__c', sortable : true, type:'text', initialWidth: 300, sortable: true},            
            {label:'City', fieldName: 'City__c', type: 'text', initialWidth: 300, sortable : true}
        ]);

 

var selectedRows = component.get("v.existingItems");
        selectedRows.forEach(function(item){            
            var newRequest = {
                Street__c: item
            };
            newRequest.sobjectType  = 'Account_Address__c';
            items.push(newRequest);
        });

Above code snippets refer below custom objects and custom fields:

Custom Object: Account_Address__c
Custom Fields: addressUniqueNumber__c, Street__c, City__c

Workaround: I did the changes and added package namespace prfix to all above custom object and fields names. Then the issue got resolved and the data is displayed in table.

addrverifyx__Account_Address__c
addrverifyx__addressUniqueNumber__c, 
addrverifyx__Street__c, 
addrverifyx__City__c

It worked fine in both Package dev org and subcriber org. I dont this is the correct solution. There may be some other reason it is not working.

I searched many salesforce expert developer community forums and I didnt find the similar issues.

Is this the correct solution? 
Why it is failing to resolve the api names?

 

Query in Developer Console:
select count() from RecordAction where ActionDefinition!=null

Error Message: 
An unexpected error occurred. Please include this ErrorId if you contact support: 1892670731-238612 (-1863376665)

When I execute same query in batch job, I got below error:
14:38:37.0 (11628419)|SYSTEM_METHOD_EXIT|[15]|BatchableContextImpl
14:38:37.0 (11636572)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:12
14:38:37.0 (11641144)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:4
14:38:37.0 (11644929)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:4
14:38:37.0 (11651159)|VARIABLE_SCOPE_BEGIN|[31]|this|Database.BatchableContextImpl|true|false
14:38:37.0 (11720780)|VARIABLE_ASSIGNMENT|[31]|this|{}|0x2d9895fe
14:38:37.0 (11727467)|VARIABLE_SCOPE_BEGIN|[31]|jobId|Id|false|false
14:38:37.0 (11833691)|VARIABLE_ASSIGNMENT|[31]|jobId|"7076g00000BKmtGAAT"
14:38:37.0 (11839995)|VARIABLE_SCOPE_BEGIN|[31]|childJobId|Id|false|false
14:38:37.0 (11861408)|VARIABLE_ASSIGNMENT|[31]|childJobId|"7076g00000BKmk3AAD"
14:38:37.0 (35565779)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:8
14:38:37.0 (178500415)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:8
14:38:37.0 (267469628)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:8
14:38:37.0 (353732986)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:8
14:38:37.0 (476538181)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:8
14:38:37.0 (564648158)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:8
14:38:37.0 (579395805)|FATAL_ERROR|Internal Salesforce.com Error


 

we are using 5998 custom labels out of maximum limit of 6000.
Manual approach of deleting one by one to find references will take more time.
Is there a programmatic approach to find where the labels are referenced.
Any help on this topic is much appreciated

public class ApexMethodBehaviourTest {
    
    public static Integer staticNum = 0;
    
    public static Integer getNumber1(Integer i1){
        staticNum = i1;
        return i1;
    }
    
    public static Integer getNumber2(Integer i2){
        getNumber1(i2);
        return staticNum;
    }
    
    public Integer getNumber3(Integer i3){
        return i3;
    }
    
    public Integer getNumber4(Integer i4){
        getNumber3(i4);
        return i4;
    }
    
}

In above code, Salesforce allows us to call NON VOID methods getNumber3(i4); and getNumber1(i2); like VOID methods!
There is another post where Raj and myself discussed and found no documentation about this topic online. 
Any thoughts/ideas will be appreciated much.

public class ApexMethodBehaviourTest {
    
    public static Integer staticNum = 0;
    
    public static Integer getNumber1(Integer i1){
        staticNum = i1;
        return i1;
    }
    
    public static Integer getNumber2(Integer i2){
        getNumber1(i2);
        return staticNum;
    }
    
    public Integer getNumber3(Integer i3){
        return i3;
    }
    
    public Integer getNumber4(Integer i4){
        getNumber3(i4);
        return i4;
    }
    
}

Today when I was reviewing the code, I observed that we can invoke a non void method as void method. It's interesting!
getNumber1(i2)  and getNumber3(i4) methods are non void but invoked as void method.

I need to add a selectlist on the vf page which has less number of picklist values than actual picklist on the object. I need to make the selectlist required and when the value is not selected the error message should display just below the select list as displayed for object fields.

I am working on a requirement to develop a lightning component to display

1. objects list as lightning:tree in left pane and
2. fields list as lightning:table in right pane as shown in below image

Actual Issue: How to display scrollbar on lightning tree/table on devices responsive to device size.
More details below:
I am not sure what is best practice to display Scrollbar when more records need to be displayed in tree and table.
Somehow I am able to display scrollbar but it seems wont work on all screen sizes. I have placed tree and table inside div with specific height
Component code

<ltng:require styles="{!$Resource.HideAppPageHeader}"/> <!--Declare Attributes--> <!--Objects Available Table --> <aura:attribute name="objList" type="Object[]"/> <aura:attribute name="filteredObjList" type="Object[]"/> <aura:attribute name="mycolumns" type="List"/> <aura:attribute name="treeItems" type="Object[]" /> <aura:attribute name="filteredTreeItems" type="Object[]" /> <aura:attribute name="searchText" type="string" default=""/> <aura:attribute name="objectTypes" type="String[]" default="['Custom', 'Standard', 'Both']" /> <aura:attribute name="objTypeValue" type="String" default="Both"/> <aura:attribute name="selectionTypes" type="String[]" default="['Selected', 'Not Selected', 'All']" /> <aura:attribute name="selTypeValue" type="String" default="All"/> <aura:attribute name="fields" access="public" type="Object[]"/> <aura:attribute name="filteredFields" access="public" type="Object[]"/> <aura:attribute name="fieldColumns" type="List"/> <aura:attribute name="selectedFields" type="List"/> <!--Declare Handler--> <aura:handler name="init" value="{!this}" action="{!c.doInit}"/> <div class="slds-grid slds-gutters_direct-xxx-small slds-scrollable--x slds-scrollable--y"> <div class="slds-col slds-size_1-of-5" style="background-color:white;"> <div class="slds-p-around_xxx-small"> <ui:inputText aura:id="textinput" keyup="{!c.searchOnKeyUp}" updateOn="keyup" value="{!v.searchText}" placeholder="Search" /> </div> <fieldset class="slds-form-element slds-p-around_xxx-small"> <div class="customRadioCls"> <aura:iteration items="{!v.objectTypes}" var="item"> <span class="slds-radio"> <input type="radio" id="{!item}" name="objradiogroup" onchange="{!c.handleObjTypeRG}" value="{!item}" checked="{!(v.objTypeValue==item)?'checked':''}"/> <label class="slds-radio__label" for="{!item}"> <span class="slds-radio_faux"></span> <span class="slds-form-element__label">{!item}</span> </label> </span> </aura:iteration> </div> </fieldset> <fieldset class="slds-form-element slds-p-around_xxx-small"> <div class="customRadioCls"> <aura:iteration items="{!v.selectionTypes}" var="item1"> <span class="slds-radio"> <input type="radio" id="{!item1}" name="selradiogroup" onchange="{!c.handleSelTypeRG}" value="{!item1}" checked="{!(v.selTypeValue==item1)?'checked':''}"/> <label class="slds-radio__label" for="{!item1}"> <span class="slds-radio_faux"></span> <span class="slds-form-element__label">{!item1}</span> </label> </span> </aura:iteration> </div> </fieldset> **<div style="height: 400px;overflow: auto;">** <!-- <div class="slds-scrollable slds-p-around_xxx-small" style="height: 430px; background-color:white ;"> --> <lightning:tree items="{! v.filteredTreeItems }" onselect="{!c.handleObjectSelect}"/> <!-- </div> --> </div> </div> <div class="slds-col slds-size_4-of-5"> **<div style="height: 500px;overflow: auto;">** <!--<div class="slds-scrollable" style="height: 500px; background-color:white ;">--> <lightning:datatable data="{!v.filteredFields}" columns="{!v.fieldColumns}" keyField="value" selectedRows="{!v.selectedFields}"/> <!-- </div> --> </div> </div> </div>

Only Tree and Table tags code snippet from above code:

</fieldset> <div style="height: 400px;overflow: auto;"> <!-- <div class="slds-scrollable slds-p-around_xxx-small" style="height: 430px; background-color:white ;"> --> <lightning:tree items="{! v.filteredTreeItems }" onselect="{!c.handleObjectSelect}"/> <!-- </div> --> </div> </div> <div class="slds-col slds-size_4-of-5"> <div style="height: 500px;overflow: auto;"> <!--<div class="slds-scrollable" style="height: 500px; background-color:white ;">--> <lightning:datatable data="{!v.filteredFields}" columns="{!v.fieldColumns}" keyField="value" selectedRows="{!v.selectedFields}"/> <!-- </div> --> </div>

Can you please help on below issues:
If I don't mention height in div, the table is not displaying all records. I have commented div tags with height: The tree and table are displayed as below. No scrollbar and no way to see all records in tree and table

<!-- <div style="height: 400px;overflow: auto;"> --> <!-- <div class="slds-scrollable slds-p-around_xxx-small" style="height: 430px; background-color:white ;"> --> <lightning:tree items="{! v.filteredTreeItems }" onselect="{!c.handleObjectSelect}"/> <!-- </div> --> <!-- </div> --> </div> <div class="slds-col slds-size_4-of-5"> <!-- <div style="height: 500px;overflow: auto;"> --> <!--<div class="slds-scrollable" style="height: 500px; background-color:white ;">--> <lightning:datatable data="{!v.filteredFields}" columns="{!v.fieldColumns}" keyField="value" selectedRows="{!v.selectedFields}"/> <!-- </div> --> <!-- </div> -->

If I mention more height than the height of screen, I can see scrollbar but, it is not showing the records at end of the scroll as it is outside of maximum height of screen. see the image below

<div style="height: 500px;overflow: auto;"> <!-- <div class="slds-scrollable slds-p-around_xxx-small" style="height: 430px; background-color:white ;"> --> <lightning:tree items="{! v.filteredTreeItems }" onselect="{!c.handleObjectSelect}"/> <!-- </div> --> </div> </div> <div class="slds-col slds-size_4-of-5"> <div style="height: 700px;overflow: auto;"> <!--<div class="slds-scrollable" style="height: 500px; background-color:white ;">--> <lightning:datatable data="{!v.filteredFields}" columns="{!v.fieldColumns}" keyField="value" selectedRows="{!v.selectedFields}"/> <!-- </div> --> </div>

I need clarifications on below queries as well:
what is the best way to display lightning table and lightning tree in lightning components so that it works well on all screens
How can I display lightning tree/table whole height on screen. Assuming that tree/table has 1000 items/rows, and show 1000 items/rows one time. without scroll bar, but page with height equla or more than tree/table height. I guess this is one of method to make it work on all devices. In my requirement, I dont expect elements more than 1000.
One more point, I have added this lightning component to Lightning App Page.

Query in Developer Console:
select count() from RecordAction where ActionDefinition!=null

Error Message: 
An unexpected error occurred. Please include this ErrorId if you contact support: 1892670731-238612 (-1863376665)

When I execute same query in batch job, I got below error:
14:38:37.0 (11628419)|SYSTEM_METHOD_EXIT|[15]|BatchableContextImpl
14:38:37.0 (11636572)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:12
14:38:37.0 (11641144)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:4
14:38:37.0 (11644929)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:4
14:38:37.0 (11651159)|VARIABLE_SCOPE_BEGIN|[31]|this|Database.BatchableContextImpl|true|false
14:38:37.0 (11720780)|VARIABLE_ASSIGNMENT|[31]|this|{}|0x2d9895fe
14:38:37.0 (11727467)|VARIABLE_SCOPE_BEGIN|[31]|jobId|Id|false|false
14:38:37.0 (11833691)|VARIABLE_ASSIGNMENT|[31]|jobId|"7076g00000BKmtGAAT"
14:38:37.0 (11839995)|VARIABLE_SCOPE_BEGIN|[31]|childJobId|Id|false|false
14:38:37.0 (11861408)|VARIABLE_ASSIGNMENT|[31]|childJobId|"7076g00000BKmk3AAD"
14:38:37.0 (35565779)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:8
14:38:37.0 (178500415)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:8
14:38:37.0 (267469628)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:8
14:38:37.0 (353732986)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:8
14:38:37.0 (476538181)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:8
14:38:37.0 (564648158)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:8
14:38:37.0 (579395805)|FATAL_ERROR|Internal Salesforce.com Error


 

public class ApexMethodBehaviourTest {
    
    public static Integer staticNum = 0;
    
    public static Integer getNumber1(Integer i1){
        staticNum = i1;
        return i1;
    }
    
    public static Integer getNumber2(Integer i2){
        getNumber1(i2);
        return staticNum;
    }
    
    public Integer getNumber3(Integer i3){
        return i3;
    }
    
    public Integer getNumber4(Integer i4){
        getNumber3(i4);
        return i4;
    }
    
}

In above code, Salesforce allows us to call NON VOID methods getNumber3(i4); and getNumber1(i2); like VOID methods!
There is another post where Raj and myself discussed and found no documentation about this topic online. 
Any thoughts/ideas will be appreciated much.

public class ApexMethodBehaviourTest {
    
    public static Integer staticNum = 0;
    
    public static Integer getNumber1(Integer i1){
        staticNum = i1;
        return i1;
    }
    
    public static Integer getNumber2(Integer i2){
        getNumber1(i2);
        return staticNum;
    }
    
    public Integer getNumber3(Integer i3){
        return i3;
    }
    
    public Integer getNumber4(Integer i4){
        getNumber3(i4);
        return i4;
    }
    
}

Today when I was reviewing the code, I observed that we can invoke a non void method as void method. It's interesting!
getNumber1(i2)  and getNumber3(i4) methods are non void but invoked as void method.