Enterprise: Tabs: Inconsistency in TabsEvent Data

[whernebrink]

Describe the bug
There is an inconsistency in what element you get from SohoTabsEvent (event.tab). It would be good to have the .tabto be consistent for all SohoTabsEvent.
E.g.

<div soho-tabs
     (activated)="onActivated($event)"
     [beforeCloseCallback]="beforeCloseCallback">

onBeforeCloseCallback = (event: SohoTabsEvent, tab: JQuery): void => {
    console.log(event.tab, tab); // event.tab and tab is the <li> element

    // one way getting the tabId  
    const tabId = event.tab.find('a').attr('tabId');
  };

  onActivated(event: SohoTabsEvent): void {
    console.log(event.tab); // event.tab is the <a> element

    // additional way you need to know to ge the tabId from the same type of event
    const tabId = event.tab.getAttribute('ng-reflect-tab-id');
  }

To Reproduce
Steps to reproduce the behavior:

1. Add (activated)="onActivated($event)" and [beforeCloseCallback="onBeforeCloseCallback" to the <div soho-tabs ...>
2. Implement the onActivated() and onBeforeCloseCallback as in the code above and log out the event.tab
3. The console.log will output the different elements <li> vs <a>

Expected behavior
All available event: SohoTabsEvent (event.tab) should reference the same type of element i.e. the <a> element (which you can do const tabId = event.tab.getAttribute('tabId/id/ng-reflect-tab-id/href/etc'); directly on).

Version

• ids-enterprise-ng: v8.0.2

Platform

• All.

Additional context
I have only tested the (activated) [beforeCloseCallback] so I do not know what the other events will give you.

[tmcconechy]

The issue is in EP on this line https://github.com/infor-design/enterprise/blob/master/src/components/tabs/tabs.js#L2492 we should make sure all tab events send the a and make sure to document this change as it is a "breaking change" that developers will need to know if they are using the li