BrowserComponent not scrolling

116 views
Skip to first unread message

P5music

unread,
Oct 23, 2020, 10:41:50 AM10/23/20
to CodenameOne Discussions
My CodenameApp has a main form that splits the screen like a master detail layout in landscape mode. It is set not scrollable.
A table layout is used with some constraints to have this appearance.
I am testint the app in the simulator.
In the left part a BrowserComponent is inside a container and displays some HTML code.
I see that the vertical bar appears on the BC because the HTML overflows vertically, but cannot be moved, it is blocked.
The BC is not resposive to the mouse wheel too. It is set scrollable.

The container is bound to the FloatingActionButton that is floating on the container itself and the BC.

Do you know any issue that prevents the BC from being scrolled? Is it something related to the Version 7.0 milestone issues?
Thanks in advance

Shai Almog

unread,
Oct 24, 2020, 1:32:54 AM10/24/20
to CodenameOne Discussions
How is it set to scrollable?
If you mean in the simulator menu try to uncheck scrollable.

Are you using CEF or the FX based browser?

P5music

unread,
Oct 24, 2020, 7:09:05 AM10/24/20
to CodenameOne Discussions
The CEF BC is used. 
for the mainform: setScrollable(false)
for the BC: setScrollableY(true)

There is no simulator menu entry "scrollable" to uncheck, and I do not understand why to uncheck it anyway, and what it would refer to?
Please can you explain?

I have nested containers and I set them all with setScrollableX(false) and setScrollableY(false).
Also the result container of fab binding is set the same. (this result container is added to the form)

A thing has be noticed.
The most deep nested level is a BorderLayout. It has in the north a vertically-short container, then in the center it has the BrowserComponent.
When attempting to scroll the BC, just sometimes I see a very tiny movement of the entire BC including the vertical scrollbar, but not the other container in north position.
This reminds me that something is scrolling that's surrounding the BC but I cannot understand what.
Do you see anything about this?

Shai Almog

unread,
Oct 24, 2020, 10:14:39 PM10/24/20
to CodenameOne Discussions
Don't change the scrollability of the browser component.

That option is under zoom and it relates to the scrolling of the simulator skin itself.

You don't need to explicitly call setScrollable(false) since that's the default. The only thing that's scrollable by default if the content pane of the main form.

P5music

unread,
Oct 25, 2020, 6:28:46 AM10/25/20
to CodenameOne Discussions
So I removed all useless calls to  setScrollable kind of methods.
It is called just on the mainForm and/or its content pane.
mainForm.setScrollable(false);
OR
mainForm.getContentPane().setScrollableY(false);
is needed to let not scroll the entire user interface.

But the BC is not scrollable.
If I set scrollableY=true for the left container it does not scroll either.
One of the BC or the left container has to be scrollable to fulfill my needs.

What further checks can be done?
Thanks

Shai Almog

unread,
Oct 25, 2020, 11:44:34 PM10/25/20
to CodenameOne Discussions
Do you see a scroll bar on the browser component?
Did you try this on the device? Did you try it with the FX version of the browser component?

P5music

unread,
Oct 26, 2020, 7:10:53 AM10/26/20
to CodenameOne Discussions
I cannot test on the FX version, I am testing the CEF one on the Simulator (no device test available too).

Yes I see the vertical scrollbar of the BrowserComponent, and it stays also with 
setScrollVisible(false);
But the BC does not scroll with that, and it does not scroll even using the mouse wheel, or dragging over with the mouse.

Shai Almog

unread,
Oct 26, 2020, 10:55:28 PM10/26/20
to CodenameOne Discussions
In that case it could be a CEF regression. Can you isolate a runnable test case that reproduces the problem and file an issue?

P5music

unread,
Oct 27, 2020, 6:15:15 AM10/27/20
to CodenameOne Discussions
It is not a regression, I created a test case with a similar layout and it worked with a Google page.

I debugged my app and it turned up being Javascript injections' fault.
But it is very strange:

The initial page of the BC is made by:

webView.setPage("<HTML><BODY style=\"display:flex;flex-direction:column;\" >"+
               createLines()+
                      "</BODY></HTML>","");
                      
where it is
private String createLines()
    {
        String result="";
        for (int i=0;i<100;i++)
            result=result+"<BR/><P>TEXT - LINE "+i+"</P>";
        return result;
    }                      
    
It is just to have a long page. At this stage the scrollbar and the mouse wheel work, and the page is scrollable.

Then a list of commands like 
var div=document.createElement('DIV');div.style.position="relative";div.id="1";document.body.appendChild(div);

are injected, in a single string.
As I can see the BC does not like that commands, even just one of them (I tried just one of them too).

The divs are correctly displayed, also with real content inside them, but the issue is present even with this bare empty div HTML.

When that command is injected the BC is no more responsive to mouse events.

This method is used:
 public void executeJS(String command)
    {
        webView.execute(command);
    }
    
What's wrong with that Javascript injection?

Shai Almog

unread,
Oct 27, 2020, 10:37:21 PM10/27/20
to CodenameOne Discussions
Did you open this in the JavaScript debugger and looked at the JS console while doing that?

P5music

unread,
Oct 28, 2020, 5:02:11 AM10/28/20
to CodenameOne Discussions
No errors in JS console.
Could it be possible that the execute() instruction is waiting for some call like onSuccess() ?
If I am not wrong, documentation says it is not the case but maybe it is an issue of the method.
Thanks

Shai Almog

unread,
Oct 28, 2020, 11:25:43 PM10/28/20
to CodenameOne Discussions
I don't know. We'll need to see an issue in isolation in the issue tracker to debug this.

P5music

unread,
Oct 29, 2020, 5:03:17 AM10/29/20
to CodenameOne Discussions
It seems that it is stuck repeating here:

while (!res.complete) {
Display.getInstance().invokeAndBlock(new Runnable() {

public void run() {
Util.wait(res, 1000);
}

});
}

in executeAndWait. 
Notice that in my app this method is not called, instead the normal execute() is.

Shai Almog

unread,
Oct 30, 2020, 2:06:54 AM10/30/20
to CodenameOne Discussions
executeAndWait uses invokeAndBlock to wait. That means that the JavaScript call never completed.
Since this happens in the simulator it's pretty easy to place a breakpoint on executeAndWait to find out who invoked it.

P5music

unread,
Oct 30, 2020, 3:30:16 AM10/30/20
to CodenameOne Discussions
I realized that the executeAndWait call came from myApp, but in another BC that's in another container. 
Now all calls are of the execute() type.

I debugged and I see that the calls are completed and the app runs again.
So the BC is not blocked by the Javascript injection.

I created a test case but I see that this blocking does happen only in my app.

What further debugging is possible, said that the execute() method seems not to the cause?

Shai Almog

unread,
Oct 31, 2020, 1:04:48 AM10/31/20
to CodenameOne Discussions
Have you tried the chrome JavaScript debugger to see where it's stuck?
Just inject some event code to see where things are blocked and see if breakpoints are reached.

P5music

unread,
Oct 31, 2020, 10:10:38 AM10/31/20
to CodenameOne Discussions
I do not see Javascript errors in Chrome (previously, syntax errors where shown and I fixed them, now there is nothing)
But I see this error in log, could it be relevant?
Exception in thread "Thread-154" java.lang.NullPointerException
at com.codename1.impl.javase.cef.ResourceHandler.getResponseHeaders(ResourceHandler.java:39)

Shai Almog

unread,
Oct 31, 2020, 10:28:13 PM10/31/20
to CodenameOne Discussions
Yes that could be relevant.
Can you update the Codename One libraries via Codename One Settings and try to reproduce this?
That line number is no longer applicable.

P5music

unread,
Nov 1, 2020, 8:46:22 AM11/1/20
to CodenameOne Discussions
That error was a one-time event, I think.
In fact the Javascript code is executed, for examples commands like this:
var div=document.createElement('DIV');div.innerText="TEXT INJECTED";div.style.position="relative";div.id="0";document.body.appendChild(div);
but then the BC is stuck.
Do you deem that another BC elsewhere in the application with other Javascript injection could cause this? Have the BCs something in common that can be cross-locked?

Shai Almog

unread,
Nov 1, 2020, 9:54:16 PM11/1/20
to CodenameOne Discussions
AFAIK they all use a single browser engine and are as a result single threaded. If JS in another component is blocking (or a navigation listener) then there could be cascading effects.

P5music

unread,
Nov 2, 2020, 3:48:29 PM11/2/20
to CodenameOne Discussions
I checked it out and it is true, BCs get stuck together
but
it is not Javascript fault.

I stripped away all lines of code step by step 
and so just it seems to be a problem caused by JSON reading json text with json array inside, or something related to ArrayLists, or creating instances of a certain class from json array elements.

The strange thing is that the JSON array is correctly extracted and all is completed with no errors, data are created correctly 
but after it the BC is stuck.

If I comment that methods that has JSON import inside the BC is not blocked.

As I can understand something is causing a silent crash inside the simulator (?!?).
I created a test case but it Does work, so I cannot reproduce the issue, indeed the BC is Not blocked.

I have no means to further debug my app.

Shai Almog

unread,
Nov 2, 2020, 10:31:24 PM11/2/20
to CodenameOne Discussions
Try thinking how the test case differs from your actual implementation. I'll ask Steve if he has an idea.

P5music

unread,
Nov 3, 2020, 4:19:16 AM11/3/20
to CodenameOne Discussions
Found the culprit. It was not Javascript, it was not JSON,

it was Dialogs.
At the completion of an import feature in my app a dialog is shown. I created a class with static methods that handle dialogs. A method like the one below causes the blocking of the BrowserComponent. In another container (it's a sort of master/detail layout) another BC is also blocked, but not the TextFields for example.
Here's the method:
public static void openAlertDialog( String s1, String s2)
{
Dialog alertDialog=new Dialog(s1);
Button okButton=new Button(okCommand);
alertDialog.setLayout(BoxLayout.y());
Container c1=new Container();
c1.setLayout(BoxLayout.x());
alertDialog.add(new SpanLabel(s2, "DialogBody"));
c1.add(okButton);
alertDialog.add(c1);
alertDialog.showDialog();
}
The dialog closes as expected but as I can understand I forgot some closing/unblocking instruction.
Is that it?

Steve Hannah

unread,
Nov 3, 2020, 7:44:34 AM11/3/20
to codenameone...@googlegroups.com
Hard to say from just that code.  In general, try to use invokeAndBlock() sparingly as it comes with a cost, and may not behave the way you expect in cases where there are multiple blocking calls overlapping.  Dialog uses invokeAndBlock for showDialog().  If you're using any "xxxAndWait()" methods in the BrowserComponent, those use invokeAndBlock also.



--
You received this message because you are subscribed to the Google Groups "CodenameOne Discussions" group.
To unsubscribe from this group and stop receiving emails from it, send an email to codenameone-discu...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/codenameone-discussions/d61c5dba-dcb1-439d-8d6c-a147f4ebd300n%40googlegroups.com.


--
Steve Hannah
Software Developer
Codename One

P5music

unread,
Nov 3, 2020, 3:06:04 PM11/3/20
to CodenameOne Discussions
Only execute() is used, and moreover that methods and the dialog method correctly return, nothing is blocked in debugging mode. It has to be something internal.
Indeed I created a test case with no Javascript execution at all. Javascript is not causing the BrowserComponent to block (in the simulator).
See the attached file. It is from a bare-bone app. A button launches a blocking dialog. Also another dialog is launched at startup that's not blocking.
You cannot select text inside the BC after you launch the blocking dialog.
Thanks
MyApplication.java

P5music

unread,
Nov 25, 2020, 5:18:18 AM11/25/20
to CodenameOne Discussions
I see that a modification has been made to a file about the issue I opened:
I am curious about what's the meaning and the gist of that modification:
if you may explain it to me.
Furthermore I see that some days ago another modification has been made:
I think it could be related to my issue too. Am I right?
What can be done? Where I could study this problem on source code?
Thanks in advance
Regards

Shai Almog

unread,
Nov 25, 2020, 9:30:42 PM11/25/20
to CodenameOne Discussions
This releases the invokeAndBlock thread more often and reduces the period the monitor is held. Honestly, I'm not sure if it's a good fix though.

P5music

unread,
Nov 26, 2020, 5:00:21 AM11/26/20
to CodenameOne Discussions
My app is very simple so the BC-blocking issue is not very profound in terms of threading I think.
I just need that the BC is unblocked.
Is it possible to have a method on the BC class that can be invoked manually to unblock the BC?
I mean, something like
myWebView.releaseBlock();
I can call it after any of my dialogs have finished interacting with the user and close.
I think that it would not bother, because I am using the dialog to return the command and it simplifies the code a lot (no runnables around), so it is a little price to pay to have this.
Regards

Shai Almog

unread,
Nov 26, 2020, 11:39:08 PM11/26/20
to CodenameOne Discussions
We had a bit of an internal discussion on this. The issue Steve worked around was related to the FX browser which is no longer applicable. So we decided to remove that as there might be performance implications.
Reply all
Reply to author
Forward
0 new messages