[x3d-public] node-java X3DJSAIL and 1 example that works, and one that doesn't

John Carlson yottzumm at gmail.com
Sat Apr 11 16:46:59 PDT 2020


This may be useful for doing more than just screenshots in headless
chrome:  https://github.com/puppeteer/puppeteer command-line seems broken.

Gonna take a break for a while. Passing the baton.
John

On Sat, Apr 11, 2020 at 6:32 PM John Carlson <yottzumm at gmail.com> wrote:

> It looks like many of the features of headless chrome have been removed.
>  There's a eunusized dump DOM, and a repl that can't print a string.  I
> don't know if people still use puppeteer or not.
>
>
>
> On Sat, Apr 11, 2020 at 6:15 PM John Carlson <yottzumm at gmail.com> wrote:
>
>> With this command, I was able to take the attached screenshot
>> (screenshot.png, at:C:/Program Files
>> (x86)/Google/Chrome/Application/80.0.3987.163/screenshot.png).  It looks
>> possible to dump DOM as well.  It looks like it takes a screenshot before
>> X_ITE loads, so it may be worth putting in some kind of delay?
>>
>> $ cat chrome.sh
>> "c:/Program Files (x86)/Google/Chrome/Application/chrome.exe" --headless
>> --disable-gpu --screenshot
>> https://www.coderextreme.net/X3DJSONLD/src/main/html/index.html
>>
>> [image: screenshot.png]
>>
>> On Sat, Apr 11, 2020 at 5:58 PM John Carlson <yottzumm at gmail.com> wrote:
>>
>>> in Bash, the chrome process looks killable, if you try all the possible
>>> ways to interrupt a command at the shell (if someone has a reliable key
>>> pattern for killing processes in bash, let me know).  Otherwise, use task
>>> manager.  (only kill the --headless process, you'll probably be unable to
>>> kill the other processes, and killing the --headless one kills the others.
>>>
>>> I've tried with a couple of sites now.  I've read that you can debug the
>>> chrome using node, but haven't tried that yet.
>>>
>>> John
>>>
>>> On Sat, Apr 11, 2020 at 5:47 PM John Carlson <yottzumm at gmail.com> wrote:
>>>
>>>> This should work!  I will start trying to run some X3DJSONLD web pages
>>>> on https://coderextreme.net
>>>>
>>>> I recommend using Command Prompt, but I'd check to see if the chrome
>>>> process is running.  PowerShell doesn't seem to be working.
>>>>
>>>> Bash seems to work, but somewhat hard to kill the process.
>>>>
>>>> "c:/Program Files (x86)/Google/Chrome/Application/chrome.exe"
>>>> --headless --disable-gpu --remote-debugging-port=9222
>>>> https://www.chromestatus.com
>>>>
>>>>
>>>>
>>>> On Sat, Apr 11, 2020 at 5:36 PM John Carlson <yottzumm at gmail.com>
>>>> wrote:
>>>>
>>>>> Here we go, help on running chrome --headless:
>>>>>
>>>>>
>>>>> https://developers.google.com/web/updates/2017/04/headless-chrome
>>>>>
>>>>> Looks cool.  I'll have to figure out how to run chrome from the
>>>>> command line.
>>>>>
>>>>> John
>>>>>
>>>>> On Sat, Apr 11, 2020 at 5:27 PM John Carlson <yottzumm at gmail.com>
>>>>> wrote:
>>>>>
>>>>>> However, the trends still say PhantomJS is more popular than headless
>>>>>> chromium:
>>>>>>
>>>>>>
>>>>>> https://trends.google.com/trends/explore?geo=US&q=%2Fm%2F012vm41z,headless%20chromium
>>>>>>
>>>>>>
>>>>>> chromium interest appears localized to california. LOL!   PhantomJS
>>>>>> interest is more national!
>>>>>>
>>>>>> However, headless chrome is much more competitive than PhantomJS, and
>>>>>> more distributed than chromium.
>>>>>>
>>>>>>
>>>>>> https://trends.google.com/trends/explore?geo=US&q=%2Fm%2F012vm41z,headless%20chrome
>>>>>>
>>>>>>
>>>>>>  I'll see what I can do with chrome.  I am already looking into
>>>>>> CEFpython for another project.
>>>>>>
>>>>>> On Sat, Apr 11, 2020 at 5:21 PM John Carlson <yottzumm at gmail.com>
>>>>>> wrote:
>>>>>>
>>>>>>> Ah, I was afraid of something like this:
>>>>>>> https://github.com/ariya/phantomjs/issues/15344  PhantomJS
>>>>>>> development is pretty much frozen.
>>>>>>>
>>>>>>> On Sat, Apr 11, 2020 at 5:18 PM John Carlson <yottzumm at gmail.com>
>>>>>>> wrote:
>>>>>>>
>>>>>>>> Hmm.  Chromium might work.   Perhaps something like node-webgl
>>>>>>>> would work?
>>>>>>>>
>>>>>>>> https://github.com/creationix/node-webgl
>>>>>>>>
>>>>>>>>  https://bugs.chromium.org/p/chromium/issues/detail?id=617551
>>>>>>>>
>>>>>>>> As of two years ago, PhantomJS was popular, followed by headless
>>>>>>>> chrome:
>>>>>>>>
>>>>>>>> https://www.keycdn.com/blog/headless-browsers
>>>>>>>>
>>>>>>>> I am not sure if either of these support webgl, but will do more
>>>>>>>> searching
>>>>>>>>
>>>>>>>> On Sat, Apr 11, 2020 at 5:07 PM John Carlson <yottzumm at gmail.com>
>>>>>>>> wrote:
>>>>>>>>
>>>>>>>>> Looks like  https://github.com/stackgl/headless-gl relies on
>>>>>>>>> Python 2.7. Further searching is necessary.
>>>>>>>>>
>>>>>>>>> On Sat, Apr 11, 2020 at 5:02 PM John Carlson <yottzumm at gmail.com>
>>>>>>>>> wrote:
>>>>>>>>>
>>>>>>>>>> Very helpful, thanks.  I will pursue a headless browser for webgl
>>>>>>>>>> in the near term.
>>>>>>>>>>
>>>>>>>>>> John
>>>>>>>>>>
>>>>>>>>>> On Sat, Apr 11, 2020 at 4:03 PM Andreas Plesch <
>>>>>>>>>> andreasplesch at gmail.com> wrote:
>>>>>>>>>>
>>>>>>>>>>> You would need to try it but exporting and then importing or
>>>>>>>>>>> requiring
>>>>>>>>>>> may work:
>>>>>>>>>>> https://github.com/create3000/x_ite/blob/master/src/x_ite.js
>>>>>>>>>>> is probably the file to work on. Building should be possible to
>>>>>>>>>>> figure
>>>>>>>>>>> out.
>>>>>>>>>>>
>>>>>>>>>>> But x_ite uses browser DOM and of course webgl methods. It may be
>>>>>>>>>>> possible to provide shims or perhaps somehow disable rendering
>>>>>>>>>>> in the
>>>>>>>>>>> render loop:
>>>>>>>>>>> https://github.com/create3000/x_ite/blob/master/src/x_ite/Browser/X3DBrowserContext.js#L248
>>>>>>>>>>> seems to be what is called each frame.
>>>>>>>>>>>
>>>>>>>>>>> -Andreas
>>>>>>>>>>>
>>>>>>>>>>> On Sat, Apr 11, 2020 at 2:09 PM John Carlson <yottzumm at gmail.com>
>>>>>>>>>>> wrote:
>>>>>>>>>>> >
>>>>>>>>>>> > To get an X3D object, would we:
>>>>>>>>>>> >
>>>>>>>>>>> > X3D = require("x_ite/X3D.js");
>>>>>>>>>>> >
>>>>>>>>>>> > Then put
>>>>>>>>>>> >
>>>>>>>>>>> > module.exports = X3D;
>>>>>>>>>>> >
>>>>>>>>>>> > at the bottom of x_ite/X3D.js?
>>>>>>>>>>> >
>>>>>>>>>>> > Or should we use something beside require in nodejs?
>>>>>>>>>>> >
>>>>>>>>>>> > The later seems more reasonable, something similar to load in
>>>>>>>>>>> Nashorn.
>>>>>>>>>>> >
>>>>>>>>>>> > Or can we use import?
>>>>>>>>>>> >
>>>>>>>>>>> > John
>>>>>>>>>>> >
>>>>>>>>>>> > On Sat, Apr 11, 2020 at 1:02 PM John Carlson <
>>>>>>>>>>> yottzumm at gmail.com> wrote:
>>>>>>>>>>> >>
>>>>>>>>>>> >> So it seems like the only problem with creating node.js
>>>>>>>>>>> External SAI for X_ITE is getting the X3D object/function, and perhaps some
>>>>>>>>>>> things as you mentioned, a node.js DOM package?  One should be able to look
>>>>>>>>>>> at X3DJSONLD for ways to get the xmldom or jsdom module. Or should we
>>>>>>>>>>> proceed assuming a browser will be available (run a headless browser).
>>>>>>>>>>> >>
>>>>>>>>>>> >> Should I revert the nodejs project to use createNode yet?
>>>>>>>>>>> And we can proceed with my previous SAI HelloWorld example by getting rid
>>>>>>>>>>> of add and set functions, instead of going down Transform and X3DJSAIL
>>>>>>>>>>> rabbit holes?
>>>>>>>>>>> >>
>>>>>>>>>>> >> Should I revisit Scripts.js (Script processor) for converting
>>>>>>>>>>> VRMLScript for X3DOM?
>>>>>>>>>>> >>
>>>>>>>>>>> >> Thanks,
>>>>>>>>>>> >>
>>>>>>>>>>> >> John
>>>>>>>>>>> >>
>>>>>>>>>>> >> On Sat, Apr 11, 2020 at 8:40 AM Andreas Plesch <
>>>>>>>>>>> andreasplesch at gmail.com> wrote:
>>>>>>>>>>> >>>
>>>>>>>>>>> >>> Hi John,
>>>>>>>>>>> >>>
>>>>>>>>>>> >>> x_ite just follows standard SAI, internal or external:
>>>>>>>>>>> >>>
>>>>>>>>>>> >>> //get Browser
>>>>>>>>>>> >>> browser=X3D.getBrowser(); //X3D is global defined by x_ite.js
>>>>>>>>>>> >>> //get current scene
>>>>>>>>>>> >>> scene=browser.currentScene;
>>>>>>>>>>> >>> //make shape node
>>>>>>>>>>> >>> shape=scene.createNode('Shape');
>>>>>>>>>>> >>> //make box node
>>>>>>>>>>> >>> box=scene.createNode('Box');
>>>>>>>>>>> >>> //set geometry field
>>>>>>>>>>> >>> shape.geometry=box;
>>>>>>>>>>> >>> //add as root node (for example)
>>>>>>>>>>> >>> scene.addRootNode(shape);
>>>>>>>>>>> >>>
>>>>>>>>>>> >>> For me the easiest way to experiment with scripting like
>>>>>>>>>>> this, is to
>>>>>>>>>>> >>> use the Chrome dev tools console with a simple scene like:
>>>>>>>>>>> >>>
>>>>>>>>>>> https://www.web3d.org/x3d/content/examples/Basic/UniversalMediaPanoramas/desert3X_ITE.html
>>>>>>>>>>> >>> Following the steps will give you a white box visible in the
>>>>>>>>>>> active scene.
>>>>>>>>>>> >>>
>>>>>>>>>>> >>> x3dom uses the DOM as an interface to the scene. So you
>>>>>>>>>>> create DOM
>>>>>>>>>>> >>> elements using HTML5 methods and add those to the Scene DOM
>>>>>>>>>>> element.
>>>>>>>>>>> >>> There may be a way to avoid using the DOM and use internal,
>>>>>>>>>>> SAI like
>>>>>>>>>>> >>> functions. For example, the javascript domNode._x3dom
>>>>>>>>>>> property gives
>>>>>>>>>>> >>> you access to fields and methods for a node. But usually it
>>>>>>>>>>> is easiest
>>>>>>>>>>> >>> and most interoperable on a HTML5 page to use the DOM.
>>>>>>>>>>> >>>
>>>>>>>>>>> >>> The field names are the same across browser but the internal
>>>>>>>>>>> >>> representation of field values (as a javascript object) is
>>>>>>>>>>> very
>>>>>>>>>>> >>> different. So one cannot use the results of SAI x_ite calls
>>>>>>>>>>> directly
>>>>>>>>>>> >>> with x3dom, or vice versa. It is necesssary to go through
>>>>>>>>>>> encodings.
>>>>>>>>>>> >>>
>>>>>>>>>>> >>> I do not think X3DJSAIL deals a lot with Browser or
>>>>>>>>>>> ExecutionContext
>>>>>>>>>>> >>> SAI functions since they are tied to the specific browser
>>>>>>>>>>> but I may be
>>>>>>>>>>> >>> wrong.
>>>>>>>>>>> >>>
>>>>>>>>>>> >>> Andreas
>>>>>>>>>>> >>>
>>>>>>>>>>> >>> On Sat, Apr 11, 2020 at 2:58 AM John Carlson <
>>>>>>>>>>> yottzumm at gmail.com> wrote:
>>>>>>>>>>> >>> >
>>>>>>>>>>> >>> > Could Andreas explain how to use createNode in the context
>>>>>>>>>>> of X_ITE SAI?
>>>>>>>>>>> >>> > I think that createNode may be the one significant thing
>>>>>>>>>>> missing from X3DOM SAI.
>>>>>>>>>>> >>> > There's an unrelated one in the physics code.
>>>>>>>>>>> >>> >
>>>>>>>>>>> >>> > That is, you use createNode to createNodes in SAI, then
>>>>>>>>>>> you use the fields of the returned object.  Are these the same across
>>>>>>>>>>> browsers?
>>>>>>>>>>> >>> >
>>>>>>>>>>> >>> > Here's how to get a node from the standard:
>>>>>>>>>>> >>> >
>>>>>>>>>>> >>> > Browser.currentScene.createNode('Shape');
>>>>>>>>>>> >>> >
>>>>>>>>>>> >>> > Again, there is no createNode in X3DJSAIL to speak of.
>>>>>>>>>>> >>> >
>>>>>>>>>>> >>> > Thanks,
>>>>>>>>>>> >>> >
>>>>>>>>>>> >>> > John
>>>>>>>>>>> >>> >
>>>>>>>>>>> >>> > On Sat, Apr 11, 2020 at 1:24 AM John Carlson <
>>>>>>>>>>> yottzumm at gmail.com> wrote:
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >> We have 2 versions of  JavaScript server side API,
>>>>>>>>>>> Nashorn and Node, both dependent on X3DJSAIL, and the code looks similar.
>>>>>>>>>>> However, we do not have a JavaScript native version yet, even with JSweet
>>>>>>>>>>> (it's incomplete).
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >> I believe that we should pursue an external SAI
>>>>>>>>>>> compatible with X_ITE, since X3DOM already has an external SAI.
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >> Below is an example of "External" with X_ITE. Note that
>>>>>>>>>>> X3D is required to be defined, and x_ite.js should be loaded before X3D is
>>>>>>>>>>> called.  So how do we do that in node?  This is why I've been suggesting
>>>>>>>>>>> headless browsers!
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >> ...so...I need to figure out an example of Transform in
>>>>>>>>>>> the standard.  It would seem like the thing to do would be to implement
>>>>>>>>>>> createNode?  Are there any examples of createNode?  Yes, in X_ITE at
>>>>>>>>>>> least.  Do we need to create an execution context to use it?  Yes!
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >> Is there an X_ITE example of external createNode?
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >> Yes!
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >> As far as I can tell there is not a X3DOM version of
>>>>>>>>>>> ECMAScript SAI's createNode.
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >> So I think we should start with X_ITE as I said before,
>>>>>>>>>>> and try to create an External ECMAScript SAI script (not DOM).
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >> Do people agree that we should try to create an
>>>>>>>>>>> ECMAScript SAI example from outside X_ITE?
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >> It appears that we either have to start from X3D(),
>>>>>>>>>>> below.   Can we make X3D() into an external SAI?
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >> Do we need a browser in nodejs?
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >> has anyone looked into chrome embedded framework?
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >> John
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >>
>>>>>>>>>>> -----------------------------------------------------------------------------
>>>>>>>>>>> >>> >> function load_X_ITE_XML(content, selector) {
>>>>>>>>>>> >>> >>         X3D(function() {
>>>>>>>>>>> >>> >>                 var browser = X3D.getBrowser(selector);
>>>>>>>>>>> >>> >>
>>>>>>>>>>>  browser.replaceWorld(browser.createX3DFromString(content));
>>>>>>>>>>> >>> >>         }, function() {
>>>>>>>>>>> >>> >>                 alert("Failed to render XML to X_ITE");
>>>>>>>>>>> >>> >>         });
>>>>>>>>>>> >>> >> }
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >> function load_X_ITE_DOM(element, selector) {
>>>>>>>>>>> >>> >>         X3D(function() {
>>>>>>>>>>> >>> >>                 if (typeof X3D.getBrowser !==
>>>>>>>>>>> 'undefined') {
>>>>>>>>>>> >>> >>                         var browser =
>>>>>>>>>>> X3D.getBrowser(selector);
>>>>>>>>>>> >>> >>                         if (typeof browser !==
>>>>>>>>>>> 'undefined' && typeof browser.importDocument !== 'undefined') {
>>>>>>>>>>> >>> >>                                 var importedScene =
>>>>>>>>>>> browser.importDocument(element);
>>>>>>>>>>> >>> >>
>>>>>>>>>>>  browser.replaceWorld(importedScene);
>>>>>>>>>>> >>> >>                         }
>>>>>>>>>>> >>> >>                 }
>>>>>>>>>>> >>> >>         }, function() {
>>>>>>>>>>> >>> >>                 alert("Failed to render DOM to X_ITE");
>>>>>>>>>>> >>> >>         });
>>>>>>>>>>> >>> >> }
>>>>>>>>>>> >>> >>
>>>>>>>>>>> >>> >> function load_X_ITE_JS(jsobj, selector) {
>>>>>>>>>>> >>> >>         X3D(function() {
>>>>>>>>>>> >>> >>                 if (typeof X3D.getBrowser !==
>>>>>>>>>>> 'undefined') {
>>>>>>>>>>> >>> >>                         var browser =
>>>>>>>>>>> X3D.getBrowser(selector);
>>>>>>>>>>> >>> >>                         if (typeof browser !==
>>>>>>>>>>> 'undefined' && typeof browser.importJS !== 'undefined') {
>>>>>>>>>>> >>> >>                                 var importedScene =
>>>>>>>>>>> browser.importJS(jsobj);
>>>>>>>>>>> >>> >>
>>>>>>>>>>>  browser.replaceWorld(importedScene);
>>>>>>>>>>> >>> >>                         }
>>>>>>>>>>> >>> >>                 }
>>>>>>>>>>> >>> >>         }, function() {
>>>>>>>>>>> >>> >>                 alert("Failed to render JSON to X_ITE");
>>>>>>>>>>> >>> >>         });
>>>>>>>>>>> >>> >> }
>>>>>>>>>>> >>> >>
>>>>>>>>>>> -------------------------------------------------------------------------------------------------------------
>>>>>>>>>>> >>> >> John
>>>>>>>>>>> >>>
>>>>>>>>>>> >>>
>>>>>>>>>>> >>>
>>>>>>>>>>> >>> --
>>>>>>>>>>> >>> Andreas Plesch
>>>>>>>>>>> >>> Waltham, MA 02453
>>>>>>>>>>>
>>>>>>>>>>>
>>>>>>>>>>>
>>>>>>>>>>> --
>>>>>>>>>>> Andreas Plesch
>>>>>>>>>>> Waltham, MA 02453
>>>>>>>>>>>
>>>>>>>>>>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://web3d.org/pipermail/x3d-public_web3d.org/attachments/20200411/fee81332/attachment-0001.html>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: screenshot.png
Type: image/png
Size: 54246 bytes
Desc: not available
URL: <http://web3d.org/pipermail/x3d-public_web3d.org/attachments/20200411/fee81332/attachment-0001.png>


More information about the x3d-public mailing list