Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

ui5 1.120.11 Unnecessary and unwanted scrollbar on sap.m.TabContainer #4016

Open
rpbouman opened this issue Mar 25, 2024 · 4 comments
Open

ui5 1.120.11 Unnecessary and unwanted scrollbar on sap.m.TabContainer #4016

rpbouman opened this issue Mar 25, 2024 · 4 comments
Labels
bug in progress

Comments

@rpbouman
Copy link

OpenUI5 version: 1.120.11

Browser/version (+device/version): Google Chrome 123.0.6312.58 official, window enterprise 10

Any other tested browsers/devices(OK/FAIL): Ege 122.0.2365.92 has same issue

URL (minimal example if possible): NA

User/password (if required and possible - do not post any confidential information here): NA

Steps to reproduce the problem:

  1. Struture: View > sap.m.Page > sap.ui.layout.Splitter > sap.m.TabContainer

What is the expected result? In ui5 1.108, there is no horizonatal scrollbar.

What happens instead? In 1.120.11 there is, even though the content does not need one

Any other information? (attach screenshot if possible) two screenshots showing same element in v 1.108 and 1.120.

image
image

Cause is the line:

overflow-x: scroll

for select .sapMTabContainer .sapMTabContainerContent .sapMTabContainerInnerContent
in https://sapui5.hana.ondemand.com/1.120.11/resources/sap/m/themes/sap_belize/library.css
@aborjinik
Copy link
Contributor

Hi @rpbouman, sorry but according to #5a of CONTRIBUTING.md#requirements-for-a-bug-report I need a running example. Could you please share with us a jsbin sample?

@rpbouman
Copy link
Author

rpbouman commented Mar 27, 2024 •
edited

Hi @aborjinik , thanks for taking the time.

I just created this minimal JSBin that reproduces the issue. The preview link is here:

https://output.jsbin.com/bapejij

and the code is below:

<!DOCTYPE HTML>
<html>
	<head>
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
		<title>ui5 issue 4016</title>
		<script src="https://openui5.hana.ondemand.com/1.120.11/resources/sap-ui-core.js" 
				id="sap-ui-bootstrap"
				data-sap-ui-libs="sap.m,sap.ui.layout" 
				data-sap-ui-xx-bindingSyntax="complex"
				data-sap-ui-theme="sap_belize"></script>
		<script type="text/javascript">
			
            var app = new sap.m.App();
			var page1 = new sap.m.Page({
				title: "issue 4016",
			});
            var tabContainer = new sap.m.TabContainer();
            var tabContainerItem = new sap.m.TabContainerItem({name: 'Item'});
            tabContainer.addItem(tabContainerItem);
            var splitter = new sap.ui.layout.Splitter({
              orientation: 'Horizontal'
            });
            
            splitter.addContentArea(tabContainer);
            splitter.addContentArea(new sap.m.Text({text: 'right'}));
            page1.addContent(splitter);
			app.addPage(page1).placeAt("content");
			
			
		</script>
		
	</head>
	<body id="content" class="sapUiBody">
	</body>
</html>

Let me know if you need more!

@rpbouman
Copy link
Author

@aborjinik is this ok? Can you reproduce it with this?

@viktorsperling
Copy link
Member

Hello @rpbouman,

Thank you for sharing this finding. The issue is still reproducible in 1.120, it should be noted in the latest version 1.123 this does not occur.
I've created an internal incident DINC0113761. The status of the issue will be updated here in GitHub.

Regards,
Viktor

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug in progress
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@rpbouman @aborjinik @viktorsperling @i556484