opal 1.6.0 → 1.7.0.rc1

data/lib/opal/cli_runners/chrome_cdp_interface.rb

@@ -3,143 +3,269 @@
 # This script I converted into Opal, so that I don't have to write
 # buffer handling again. We have gets, Node has nothing close to it,
 # even async.
+# For CDP see docs/cdp_common.(md|json)
 
 require 'opal/platform'
+require 'nodejs/env'
 
 %x{
 var CDP = require("chrome-remote-interface");
 var fs = require("fs");
+var http = require("http");
 
-var dir = #{ARGV.last}
+var dir = #{ARGV.last};
+var ext = #{ENV['OPAL_CDP_EXT']};
+var port_offset; // port offset for http server, depending on number of targets
+var script_id;   // of script which is executed after page is initialized, before page scripts are executed
+var cdp_client;  // CDP client
+var target_id;   // the used Target
 
 var options = {
   host: #{ENV['CHROME_HOST'] || 'localhost'},
-  port: #{ENV['CHROME_PORT'] || 9222}
+  port: parseInt(#{ENV['CHROME_PORT'] || '9222'})
 };
 
-CDP(options, function(client) {
-  var Page = client.Page,
-      Runtime = client.Runtime,
-      Console = client.Console;
-
-  Promise.all([
-    Console.enable(),
-    Page.enable(),
-    Runtime.enable(),
-  ]).then(function() {
-    // This hook catches only the first argument of `console.log`
-    // More advanced version Runtime.consoleAPICalled returns all arguments
-    // but all of them are not formatted, i.e. by calling
-    //   console.log('string', [1, 2, 3], {a: 'b'})
-    // it returns the following data to the callback:
-    //   {
-    //     "type":"log",
-    //     "args":[
-    //       {
-    //         "type":"string",
-    //         "value":"string"
-    //       },
-    //       {
-    //         "type":"object",
-    //         "subtype":"array",
-    //         "className":"Array",
-    //         "description":"Array(3)",
-    //         "objectId":"{\"injectedScriptId\":11,\"id\":1}",
-    //         "preview":{
-    //           "type":"object",
-    //           "subtype":"array",
-    //           "description":"Array(3)",
-    //           "overflow":false,
-    //           "properties":[
-    //             {"name":"0","type":"number","value":"1"},
-    //             {"name":"1","type":"number","value":"2"},
-    //             {"name":"2","type":"number","value":"3"}
-    //           ]
-    //         }
-    //       },
-    //       {
-    //         "type":"object",
-    //         "className":"Object",
-    //         "description":"Object",
-    //         "objectId":"{\"injectedScriptId\":11,\"id\":2}",
-    //         "preview":{
-    //           "type":"object",
-    //           "description":"Object",
-    //           "overflow":false,
-    //           "properties":[
-    //             {"name":"a","type":"string","value":"b"}
-    //           ]
-    //         }
-    //       }
-    //     ],
-    //     // ...
-    //   }
-    // Supporting this format for complex data structure is challenging, feel free to contribute!
-    //
-    Console.messageAdded(function(console_message) {
-      process.stdout.write(console_message.message.text);
-    });
+// shared secret
+
+function random_string() {
+  let chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+  let str = '';
+  for (let i = 0; i < 256; i++) {
+    str += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return str;
+};
+
+var shared_secret = random_string(); // secret must be passed with POST requests
+
+// support functions
+
+function perror(error) { console.error(error); }
+
+var exiting = false;
+
+function shutdown(exit_code) {
+  if (exiting) { return Promise.resolve(); }
+  exiting = true;
+  var promises = [];
+  cdp_client.Page.removeScriptToEvaluateOnNewDocument(script_id).then(function(){}, perror);
+  return Promise.all(promises).then(function () {
+    target_id ? cdp_client.Target.closeTarget(target_id) : null;
+  }).then(function() {
+    server.close();
+    process.exit(exit_code);
+  }, function(error) {
+    perror(error);
+    process.exit(1)
+  });
+};
 
-    Runtime.exceptionThrown(function(exception) {
-      var properties = exception.exceptionDetails.exception.preview.properties,
-          stack, i;
+// simple HTTP server to deliver page, scripts to, and trigger commands from browser
 
-      for (i = 0; i < properties.length; i++) {
-        var property = properties[i];
+function not_found(res) {
+  res.writeHead(404, { "Content-Type": "text/plain" });
+  res.end("NOT FOUND");
+}
 
-        if (property.name == "stack") {
-          stack = property.value;
-        }
+function response_ok(res) {
+  res.writeHead(200, { "Content-Type": "text/plain" });
+  res.end("OK");
+}
+
+function handle_post(req, res, fun) {
+  var data = "";
+  req.on('data', function(chunk) {
+    data += chunk;
+  })
+  req.on('end', function() {
+    var obj = JSON.parse(data);
+    if (obj.secret == shared_secret) {
+      fun.call(this, obj);
+    } else {
+      not_found(res);
+    }
+  });
+}
+
+var server = http.createServer(function(req, res) {
+  if (req.method === "GET") {
+    var path = dir + '/' + req.url.slice(1);
+    if (path.includes('..') || !fs.existsSync(path)) {
+      not_found(res);
+    } else {
+      var content_type;
+      if (path.endsWith(".html")) {
+        content_type = "text/html"
+      } else if (path.endsWith(".map")) {
+        content_type = "application/json"
+      } else {
+        content_type = "application/javascript"
       }
+      res.writeHead(200, { "Content-Type": content_type });
+      res.end(fs.readFileSync(path));
+    }
+  } else if (req.method === "POST") {
+    if (req.url === "/File.write") {
+      // totally insecure on purpose
+      handle_post(req, res, function(obj) {
+        fs.writeFileSync(obj.filename, obj.data);
+        response_ok(res);
+      });
+    } else {
+      not_found(res);
+    }
+  } else {
+    not_found(res);
+  }
+});
 
-      console.log(stack);
+// actual CDP code
 
-      process.exit(1);
-    });
+CDP.List(options, function(err, targets) {
+  // default CDP port is 9222, Firefox runner is at 9333
+  // Lets collect clients for
+  // Chrome CDP starting at 9273 ...
+  // Firefox CDP starting 9334 ...
+  port_offset = targets ? targets.length + 51 : 51; // default CDP port is 9222, Node CDP port 9229, Firefox is at 9333
 
-    Page.javascriptDialogOpening((dialog) => {
-      #{
-        if `dialog.type` == 'prompt'
-          message = gets&.chomp
-          if message
-            `Page.handleJavaScriptDialog({accept: true, promptText: #{message}})`
-          else
-            `Page.handleJavaScriptDialog({accept: false})`
-          end
-        elsif `dialog.type` == 'alert' && `dialog.message` == 'opalheadlesschromeexit'
-          # A special case of an alert with a magic string "opalheadlesschromeexit".
-          # This denotes that `Kernel#exit` has been called. We would have rather used
-          # an exception here, but they don't bubble sometimes.
-          %x{
-            Page.handleJavaScriptDialog({accept: true});
+  return CDP(options, function(browser_client) {
+
+    server.listen({ port: port_offset + options.port, host: options.host });
+
+    browser_client.Target.createTarget({url: "about:blank"}).then(function(target) {
+      target_id = target;
+      options.target = target_id.targetId;
+
+      CDP(options, function(client) {
+        cdp_client = client;
+
+        var Log = client.Log,
+            Page = client.Page,
+            Runtime = client.Runtime;
+
+        // enable used CDP domains
+        Promise.all([
+          Log.enable(),
+          Page.enable(),
+          Runtime.enable()
+        ]).then(function() {
+          // add script to set the shared_secret in the browser
+          return Page.addScriptToEvaluateOnNewDocument({source: "window.OPAL_CDP_SHARED_SECRET = '" + shared_secret + "';"}).then(function(scrid) {
+            script_id = scrid;
+          }, perror);
+        }, perror).then(function() {
+
+          // receive and handle all kinds of log and console messages
+          Log.entryAdded(function(entry) {
+            process.stdout.write(entry.entry.level + ': ' + entry.entry.text + "\n");
+          });
+
+          Runtime.consoleAPICalled(function(entry) {
+            var args = entry.args;
+            var stack = null;
+            var i, arg, frame, value;
+
+            // output actual message
+            for(i = 0; i < args.length; i++) {
+              arg = args[i];
+              if (arg.type === "string") { value = arg.value; }
+              else { value = JSON.stringify(arg); }
+              process.stdout.write(value);
+            }
+
+            if (entry.stackTrace && entry.stackTrace.callFrames) {
+              stack = entry.stackTrace.callFrames;
+            }
+
+            if (entry.type === "error" && stack) {
+              // print full stack for errors
+              process.stdout.write("\n");
+              for(i = 0; i < stack.length; i++) {
+                frame = stack[i];
+                if (frame) {
+                  value = frame.url + ':' + frame.lineNumer + ':' + frame.columnNumber + '\n';
+                  process.stdout.write(value);
+                }
+              }
+            }
+          });
+
+          // react to exceptions
+          Runtime.exceptionThrown(function(exception) {
+            var ex = exception.exceptionDetails.exception.preview.properties;
+            var stack = [];
+            if (exception.exceptionDetails.stackTrace) {
+              stack = exception.exceptionDetails.stackTrace.callFrames;
+            } else {
+              var d = exception.exceptionDetails;
+              stack.push({
+                url: d.url,
+                lineNumber: d.lineNumber,
+                columnNumber: d.columnNumber,
+                functionName: "(unknown)"
+              });
+            }
+            var fr;
+            for (var i = 0; i < ex.length; i++) {
+              fr = ex[i];
+              if (fr.name === "message") {
+                perror(fr.value);
+              }
+            }
+            for (var i = 0; i < stack.length; i++) {
+              fr = stack[i];
+              perror(fr.url + ':' + fr.lineNumber + ':' + fr.columnNumber + ': in ' + fr.functionName);
+            }
+            return shutdown(1);
+          });
+
+          // handle input
+          Page.javascriptDialogOpening((dialog) => {
+            #{
+              if `dialog.type` == 'prompt'
+                message = gets&.chomp
+                if message
+                  `Page.handleJavaScriptDialog({accept: true, promptText: #{message}})`
+                else
+                  `Page.handleJavaScriptDialog({accept: false})`
+                end
+              elsif `dialog.type` == 'alert' && `dialog.message` == 'opalheadlessbrowserexit'
+                # A special case of an alert with a magic string "opalheadlessbrowserexit".
+                # This denotes that `Kernel#exit` has been called. We would have rather used
+                # an exception here, but they don't bubble sometimes.
+                %x{
+                  Page.handleJavaScriptDialog({accept: true});
+                  Runtime.evaluate({ expression: "window.OPAL_EXIT_CODE" }).then(function(output) {
+                    var exit_code = 0;
+                    if (typeof(output.result) !== "undefined" && output.result.type === "number") {
+                      exit_code = output.result.value;
+                    }
+                    return shutdown(exit_code);
+                  });
+                }
+              end
+            }
+          });
+
+          // page has been loaded, all code has been executed
+          Page.loadEventFired(() => {
             Runtime.evaluate({ expression: "window.OPAL_EXIT_CODE" }).then(function(output) {
-              client.close();
               if (typeof(output.result) !== "undefined" && output.result.type === "number") {
-                process.exit(output.result.value);
+                return shutdown(output.result.value);
+              } else if (typeof(output.result) !== "undefined" && output.result.type === "string" && output.result.value === "noexit") {
+                // do nothing, we have headless chrome support enabled and there are most probably async events awaiting
               } else {
-                process.exit(0);
+                return shutdown(0);
               }
-            });
-          }
-        end
-      }
-    });
+            })
+          });
 
-    Page.loadEventFired(() => {
-      Runtime.evaluate({ expression: "window.OPAL_EXIT_CODE" }).then(function(output) {
-        if (typeof(output.result) !== "undefined" && output.result.type === "number") {
-          client.close();
-          process.exit(output.result.value);
-        } else if (typeof(output.result) !== "undefined" && output.result.type === "string" && output.result.value === "noexit") {
-          // do nothing, we have headless chrome support enabled and there are most probably async events awaiting
-        } else {
-          client.close();
-          process.exit(0);
-        }
-      })
+          // init page load
+          Page.navigate({ url: "http://localhost:" + (port_offset + options.port).toString() + "/index.html" })
+        }, perror);
+      });
     });
-
-    Page.navigate({ url: "file://"+dir+"/index.html" })
   });
 });
 }
+# end of code (marker to help see if brackets match above)

data/lib/opal/cli_runners/compiler.rb

@@ -3,16 +3,149 @@
 require 'opal/paths'
 
 # The compiler runner will just output the compiled JavaScript
-Opal::CliRunners::Compiler = ->(data) {
-  options  = data[:options] || {}
-  builder  = data.fetch(:builder).call
-  map_file = options[:map_file]
-  output   = data.fetch(:output)
-
-  compiled_source = builder.to_s
-  compiled_source += "\n" + builder.source_map.to_data_uri_comment unless options[:no_source_map]
-  output.puts compiled_source
-  File.write(map_file, builder.source_map.to_json) if map_file
-
-  0
-}
+class Opal::CliRunners::Compiler
+  def self.call(data)
+    new(data).start
+  end
+
+  def initialize(data)
+    @options         = data[:options] || {}
+    @builder_factory = data.fetch(:builder)
+    @map_file        = @options[:map_file]
+    @output          = data.fetch(:output)
+    @watch           = @options[:watch]
+  end
+
+  def compile
+    builder = @builder_factory.call
+    compiled_source = builder.to_s
+    compiled_source += "\n" + builder.source_map.to_data_uri_comment unless @options[:no_source_map]
+
+    rewind_output if @watch
+
+    @output.puts compiled_source
+    @output.flush
+
+    File.write(@map_file, builder.source_map.to_json) if @map_file
+
+    builder
+  end
+
+  def compile_noraise
+    compile
+  rescue StandardError, Opal::SyntaxError => e
+    $stderr.puts "* Compilation failed: #{e.message}"
+    nil
+  end
+
+  def rewind_output
+    if !@output.is_a?(File) || @output.tty?
+      fail_unrewindable!
+    else
+      begin
+        @output.rewind
+        @output.truncate(0)
+      rescue Errno::ESPIPE
+        fail_unrewindable!
+      end
+    end
+  end
+
+  def fail_unrewindable!
+    warn <<~ERROR
+      You have specified --watch, but for watch to work, you must specify an
+      --output file.
+    ERROR
+    exit 1
+  end
+
+  def fail_no_listen!
+    warn <<~ERROR
+      --watch mode requires the `listen` gem present. Please try to run:
+
+          gem install listen
+
+      Or if you are using bundler, add listen to your Gemfile.
+    ERROR
+    exit 1
+  end
+
+  def watch_compile
+    begin
+      require 'listen'
+    rescue LoadError
+      fail_no_listen!
+    end
+
+    @opal_deps = Opal.dependent_files
+
+    builder = compile
+    code_deps = builder.dependent_files
+    @files = @opal_deps + code_deps
+    @code_listener = watch_files
+    @code_listener.start
+
+    $stderr.puts "* Opal v#{Opal::VERSION} successfully compiled your program in --watch mode"
+
+    sleep
+  end
+
+  def reexec
+    system($0, *OriginalARGV) && exit
+  end
+
+  def on_code_change(modified)
+    if !(modified & @opal_deps).empty?
+      $stderr.puts "* Modified core Opal files: #{modified.join(', ')}; reexecuting"
+      reexec
+    elsif !modified.all? { |file| @directories.any? { |dir| file.start_with?(dir + '/') } }
+      $stderr.puts "* New unwatched files: #{modified.join(', ')}; reexecuting"
+      reexec
+    end
+
+    $stderr.puts "* Modified code: #{modified.join(', ')}; rebuilding"
+
+    builder = compile_noraise
+
+    # Ignore the bad compilation
+    if builder
+      code_deps = builder.dependent_files
+      @files = @opal_deps + code_deps
+    end
+  end
+
+  def files_to_directories
+    directories = @files.map { |file| File.dirname(file) }.uniq
+
+    previous_dir = nil
+    # Only get the topmost directories
+    directories = directories.sort.map do |dir|
+      if previous_dir && dir.start_with?(previous_dir + '/')
+        nil
+      else
+        previous_dir = dir
+      end
+    end
+
+    directories.compact
+  end
+
+  def watch_files
+    @directories = files_to_directories
+
+    Listen.to(*@directories) do |modified, added, removed|
+      our_modified = @files & (modified + added + removed)
+      on_code_change(our_modified) unless our_modified.empty?
+    end
+  end
+
+  def start
+    if @watch
+      watch_compile
+    else
+      compile
+    end
+
+    0
+  end
+end

data/lib/opal/cli_runners/deno.rb

@@ -0,0 +1,32 @@
+# frozen_string_literal: true
+
+require 'shellwords'
+require 'opal/paths'
+require 'opal/cli_runners/system_runner'
+require 'opal/os'
+
+module Opal
+  module CliRunners
+    class Deno
+      def self.call(data)
+        argv = data[:argv].dup.to_a
+
+        SystemRunner.call(data) do |tempfile|
+          [
+            'deno',
+            'run',
+            '--allow-read',
+            '--allow-write',
+            tempfile.path,
+            *argv
+          ]
+        end
+      rescue Errno::ENOENT
+        raise MissingDeno, 'Please install Deno to be able to run Opal scripts.'
+      end
+
+      class MissingDeno < RunnerError
+      end
+    end
+  end
+end