Announcement

**Isomorphic** · 30 Mar 2017, 15:23

The underlying problem here is bugs in native browser scrollbars. This is why it's skin-specific: Simplicity is the only skin that uses browser scrollbars by default.

Unfortunately we have no general way of working around this since the issue arises with various patterns of nested elements which come up near-randomly as you compose your UI.

The simplest fix is to simply disable native scrollbars using the property canvas.useCustomScrollbars.

**ellisd5** · 31 Mar 2017, 02:22

I've just realised that we already do that suggested work around, as that was suggested for this defect...

http://forums.smartclient.com/forum/...ed-in-showcase

Checking the network tab there is only only theme being loaded so don't think that is the issue...

Code:

<!DOCTYPE html>
<html>
<head>

    <meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
    <meta name="viewport" content="initial-scale=1, width=device-width, user-scalable=no, minimum-scale=1, maximum-scale=1, minimal-ui"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>

    <title>Liberty CXM</title>

    <link rel="shortcut icon" href="favicon.ico"/>


    <script type="text/javascript" language="javascript" src="./js/jquery-2.1.4.min.js"></script>
    <script type="text/javascript" language="javascript" src="ckeditor-4.3.4/ckeditor.js"></script>
    <script type="text/javascript" language="javascript" src="ckeditor-4.3.4/adapters/jquery.js"></script>
    <script type="text/javascript" language="javascript" src="js/sandblaster.js"></script>

</head>
<body class="title">

<iframe src="javascript:''" id="__gwt_historyFrame" style="width:0;height:0;border:0"></iframe>

<script type="text/javascript">
    var isomorphicDir = "serengeti.crm/sc/";
    isc_css3Mode = "on";
</script>

<!-- Used for flashing messgae alert when browser minimised -->
<script type="text/javascript" src="js/browserActive.js"></script>

<!--include the SC Core API-->


<script type="text/javascript">setStageMessage("Loading ISC_Core.js");</script>
<script src="serengeti.crm/sc/modules/ISC_Core.js"></script>

<script type="text/javascript">setStageMessage("Loading ISC_Foundation.js");</script>
<script src="serengeti.crm/sc/modules/ISC_Foundation.js"></script>

<script type="text/javascript">setStageMessage("Loading ISC_Containers.js");</script>
<script src="serengeti.crm/sc/modules/ISC_Containers.js"></script>

<script type="text/javascript">setStageMessage("Loading ISC_Grids.js");</script>
<script src="serengeti.crm/sc/modules/ISC_Grids.js"></script>

<script type="text/javascript">setStageMessage("Loading ISC_Forms.js");</script>
<script src="serengeti.crm/sc/modules/ISC_Forms.js"></script>

<script type="text/javascript">setStageMessage("Loading ISC_RichTextEditor.js");</script>
<script src="serengeti.crm/sc/modules/ISC_RichTextEditor.js"></script>

<script type="text/javascript">setStageMessage("Loading ISC_Calendar.js");</script>
<script src="serengeti.crm/sc/modules/ISC_Calendar.js"></script>

<script type="text/javascript">setStageMessage("Loading ISC_DataBinding.js");</script>
<script src="serengeti.crm/sc/modules/ISC_DataBinding.js"></script>

<script type="text/javascript">setStageMessage("Loading ISC_Drawing.js");</script>
<script src="serengeti.crm/sc/modules/ISC_Drawing.js"></script>

<script type="text/javascript">setStageMessage("Loading ISC_Charts.js");</script>
<script src="serengeti.crm/sc/modules/ISC_Charts.js"></script>



<script type="text/javascript">
    // CRM-3444 - Work around - http://forums.smartclient.com/forum/smart-gwt-technical-q-a/34222-issue-with-selectitem-in-simplicity-skin-verified-in-showcase#post232586
    isc.Canvas.addProperties({showCustomScrollbars: true});
</script>

<script src="serengeti.crm/sc/skins/Simplicity/load_skin.js?isc_version=10.0.js"></script>
<script type="text/javascript" language="javascript" src="serengeti.crm/serengeti.crm.nocache.js"></script>

</body>
</html>

What else could cause the issue? Is there anything else I can provide to help figure out this issue?

**ellisd5** · 31 Mar 2017, 04:34

Also just to add to this, our users are reporting similar issues when they use browser zooming, believe this may be happening for all skins

**Blama** · 31 Mar 2017, 04:51

Hi ellisd5,

I had problems with Browser or System zoom as well, please note that it is not supported.
I did not hear complaints because of to small fonts etc. so far, but if I do, it could be a solution to use the 6.0p-resize features and offer them in the GUI like in the showcase.

Best regards
Blama

**Isomorphic** · 31 Mar 2017, 10:15

Although it looks like you are enabling custom scrollbars correctly, you should double-check the live application using browser DOM inspection tools, as we have zero outstanding reports of flickering scrollbars with any non-Simplicity skins, as you've said yourself that this problem is not happening in other skins (at least without zoom).

As far as fixing the problem if real, it's always the same thing: we need a way to reproduce the problem, or we can't fix it. Ideally, a minimal, ready-to-run test case.

As far as looking into this on your own first, we would look at whether it can still be reproduced if you remove all CSS rules that didn't come from our software, and whether it can be reproduced if you remove third-party JS libraries.

**Blama** · 31 Mar 2017, 12:02

FYI: IMHO you can see from the Screenshot in #1 that custom scrollbars are indeed in use.

Best regards
Blama (not OP)

**ellisd5** · 4 Apr 2017, 23:22

Yea I should have stated a the time, I checked the DOM, they are custom scrollbars.I will try and create you a simple test case (although as there is a workaround (use different skin) this probably won't be for some time)

Thanks
Dale

GWT Version :	2.7.0
SmartGWT Version :	5.1p
SmartGWT Build Date :	01/12/2016 06:19

Announcement

Disco/Flickering Screen, Visual defects with Simplicity

Comment

Comment

Comment

Comment

Comment

Comment

Comment