RubyGems - view_inspect - Versions diffs - 0.1.0 → 0.2.0 - Mend

view_inspect 0.1.0 → 0.2.0

Files changed (13) hide show

checksums.yaml +8 -8
data/README.markdown +34 -0
data/example/sample.html +118 -0
data/lib/view_inspect/erb.rb +4 -2
data/lib/view_inspect/middleware.rb +49 -0
data/lib/view_inspect/railtie.rb +8 -3
data/lib/view_inspect/version.rb +3 -0
data/lib/view_inspect/view_inspect.js +109 -0
data/lib/view_inspect.rb +0 -2
data/view_inspect.gemspec +3 -1
metadata +7 -4
data/README.rdoc +0 -31
data/VERSION +0 -1

checksums.yaml CHANGED Viewed

@@ -1,15 +1,15 @@
 ---
 !binary "U0hBMQ==":
   metadata.gz: !binary |-
-    YmU4ZjA5Yjg2OTdkZTg0NjhjOTlhYzllZDIyZDMyZDM1NjYwZTZiZg==
+    ODE1N2FkNDI2ZjU5NjYxMWIzNzc5NjJhYzYyYjRjNTdjOGJlMDk4ZQ==
   data.tar.gz: !binary |-
-    NjdiM2UwMzZiMjlmYjM4YmVmYzRjNjQ4MDI4MTMzYzk2MWUyNWYxNA==
+    YjE1NjI1MjczOGRiNmM4ZGE3Zjk5YTZjMmE1MmJmZTRiZDVhMDVkZA==
 SHA512:
   metadata.gz: !binary |-
-    YmZlNTIyNjllZWM2YjQ2NjY2YzQ5ZjEwYTAyZTJlZDAyNjY0YjU0Nzk3NmI5
-    NWViOGQ2MzdlYTJkZjUxYTE1MzA4OGQzMmU5MDMwOGU4NDY0NTU4NWRiNWQ0
-    MWRjNDA5ZTNkMDJkMzYwNDNkOTJlYWU1ZjA5N2E5ZjMzOWRmZDc=
+    ZWIzNDFiYTgyODE0NDhmMTA5ZjQ3MTk5MDE2ODE0MjM3YzhiYTI3NTg5NjBh
+    ZjNlMjM3NWQyNWZkNWE5NmNmODJjODQ3NzdkODc2MzY1MDM4NzFiNThjMzc5
+    Mzc3Zjc0N2Q0MzE5MzNiMTNkNWE2M2I3NGJjZTI3MTdhYjVhMjY=
   data.tar.gz: !binary |-
-    NTBmMjVkNTYyMmE3OGFkZTc5N2JlNGQwODYwNGUzNWY0MTU4MGE1YTlmNjBm
-    MWNiOTVlNDY2MjZmNDQ4MjFiNzM0MDUyY2E5YjQyMzg0NjVhYWNlY2M2MDg1
-    YjliMmZkZDkzZTM4NzI2MmEzYmNjZWJjZWU1ODE5MTY4YjA0NjQ=
+    ZmJlOTI0YWZhNGFlOWU4YTgxNjZiZDZlYjk5NjI2ODlkMDUyY2NjMWZhNDMw
+    NTkzYTY5N2QyZWM0YzJiZGI1MWNmYmJjZjQ2YmVhZDFiOWQzNjE1NjI1Nzkz
+    M2E3ZDljZmQ5YzQ4NjlmZTA5ZjkwNzUwYTExMmI5Y2FjZTA2MjI=

data/README.markdown ADDED Viewed

@@ -0,0 +1,34 @@
+= View Inspect
+View Inspect shows you the source location of a client or server rendered DOM element. It currently only works for Rails where erb and haml templates are supported. For client rendered DOM, only basic javascript, jQuery, and Backbone.js is supported.
+== Demo
+== Installation
+    group :development do
+      gem "view_inspect"
+    end
+To enable javascript DOM source location tracking, you need to specify external libraries you wish to prevent from showing up as a potential source location. This is because of the way we track the origin of client-side DOM insertion. See How it Works to understand why.
+    <head data-orig-exclude-list="jquery,backbone">
+== How it Works
+For server-rendered DOM elements, we monkey patch view template generation to include the file and line information in the html nodes.
+For client-rendered DOM elements, we intercept the native DOM insertion methods such as `appendChild`, `insertBefore`, or `replaceChild`, look at the stacktrace, and go through it to find the most recent caller that includes our javascript code.
+== Warning
+Don't run this on production. Preferably, you should only run this locally, not even on staging environments. View Inspect shows you the fullpath of your and back-end and front-end code. That is unless you dont mind people seeing things like /home/nandato/rails/app/releases/20131012158211/app/views/ganbatte/show.html.erb:2 in the HTML source
+== Copyright
+Copyright (c) 2014 Reginald Tan. See LICENSE.txt for
+further details.

data/example/sample.html ADDED Viewed

@@ -0,0 +1,118 @@
+<!DOCTYPE html>
+<html lang="pt-BR">
+    <head data-orig-exclude-list='jquery'>
+      <title>Yes</title>
+        <meta charset="utf-8">
+        <meta name="keywords" content=""/>
+        <meta name="description" content=""/>
+        <link rel="shortcut icon" href="favicon.ico">
+        <style type="text/css" media="screen">
+          .white {
+            width: 50px;
+            height: 50px;
+            background-color: white;
+            border: solid 1px black;
+          }
+          .black {
+            width: 50px;
+            height: 50px;
+            background-color: black;
+            border: solid 1px black;
+            margin-top: 20px;
+          }
+          .green {
+            width: 30px;
+            height: 10px;
+            background-color: green;
+          }
+          .blue {
+            width: 20px;
+            height: 30px;
+            background-color: blue;
+          }
+          .red {
+            width: 40px;
+            height: 20px;
+            background-color: red;
+          }
+          .yellow {
+            width: 10px;
+            height: 10px;
+            background-color: yellow;
+          }
+        </style>
+        <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
+        <script src="./../lib/view_inspect/view_inspect.js" type="text/javascript" charset="utf-8"></script>
+        <!--[if IE]>
+          <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+        <![endif]-->
+    </head>
+    <body>
+      <header>
+      </header>
+      <section id="main">
+      </section>
+      <footer>
+      </footer>
+    </body>
+    <script type="text/javascript" language="javascript" charset="utf-8">
+    //<![CDATA[
+      jQuery(document).ready(function(){
+        var node;
+        var child;
+        node = document.createElement("div");
+        node.className = "white";
+        document.getElementById("main").appendChild(node);
+        child = document.createElement("div");
+        child.className = "green";
+        node.appendChild(child);
+        child_2 = document.createElement("div");
+        child_2.className = "green";
+        node.replaceChild(child_2,child);
+        child_3 = document.createElement("div");
+        child_3.className = "blue";
+        node.insertBefore(child_3,child_2);
+        $node = $("<div class='black'>");
+        $("#main").append($node);
+        $child = $("<div class='green'>");
+        $node.append($child);
+        $child_2 = $("<div class='yellow'>");
+        $child.replaceWith($child_2);
+        $child_3 = $("<div class='red'>");
+        $child_3.insertBefore($child_2);
+      });
+    //]]>
+    </script>
+</html>

data/lib/view_inspect/erb.rb CHANGED Viewed

@@ -1,3 +1,5 @@
+require 'nokogiri'
 module ViewInspect
   module ERB
     # from erubis 2.7.0
@@ -29,10 +31,10 @@ module ViewInspect
     end
     def self.add_file_line(source, filepath)
-      doc = Nokogiri::HTML(source)
+      doc = ::Nokogiri::HTML(source)
       doc.traverse do |node|
-        if node.is_a?(Nokogiri::XML::Element)
+        if node.is_a?(::Nokogiri::XML::Element)
           file_line = [filepath, node.line].join(":")
           node.set_attribute "data-orig-file-line", file_line
         end

data/lib/view_inspect/middleware.rb ADDED Viewed

@@ -0,0 +1,49 @@
+module ViewInspect
+  class Middleware
+    HEAD_REGEXP = /(<head.*>)/
+    HTML_CONTENT_TYPE_REGEXP = /text\/html|application\/xhtml\+xml/
+    def initialize(app)
+      @app = app
+    end
+    def call(env)
+      status, headers, response = @app.call(env)
+      if headers["Content-Type"] =~ HTML_CONTENT_TYPE_REGEXP && response.body.to_s =~ HEAD_REGEXP
+        body = insert_view_inspect_script(response.body)
+        headers["Content-Length"] = body.length.to_s
+        response = [body]
+      end
+      [status, headers, response]
+    end
+    def insert_view_inspect_script(body)
+      index = get_insert_position(body)
+      body.insert(index, get_inline_script)
+      body
+    end
+    def get_insert_position(body)
+      index = body.index(HEAD_REGEXP)
+      match = $1
+      return index + match.length
+    end
+    def get_script
+      filepath = File.expand_path("view_inspect.js",File.dirname(__FILE__))
+      File.read(filepath)
+    end
+    def get_inline_script
+      <<-CODE
+        <script type="text/javascript" language="javascript" charset="utf-8">
+        //<![CDATA[
+          #{get_script}
+        //]]>
+        </script>
+      CODE
+    end
+  end
+end

data/lib/view_inspect/railtie.rb CHANGED Viewed

@@ -1,7 +1,12 @@
+require 'view_inspect/middleware'
 module ViewInspect
   class Railtie < Rails::Railtie
-    initializer "view_inspect_railtie.configure_rails_initialization" do
-      ViewInspect.enable
+    initializer "view_inspect_railtie.configure_rails_initialization" do |app|
+      if ViewInspect.allow_view_source_location?
+        ViewInspect.enable
+        app.middleware.use ViewInspect::Middleware
+      end
     end
   end
-end
+end

data/lib/view_inspect/version.rb ADDED Viewed

@@ -0,0 +1,3 @@
+module ViewInspect
+  VERSION = "0.2.0"
+end

data/lib/view_inspect/view_inspect.js ADDED Viewed

@@ -0,0 +1,109 @@
+(function(){
+  var DOM_INSERT_METHOD_NAMES = [
+    "appendChild",
+    "insertBefore",
+    "replaceChild",
+  ];
+  var fileExcludeList;
+  var getStacktrace = function() {
+    var e = new Error('dummy');
+    var stack = e.stack.replace(/^[^\(]+?[\n$]/gm, '')
+        .replace(/^\s+at\s+/gm, '')
+        .replace(/^Object.<anonymous>\s*\(/gm, '{anonymous}()@')
+        .split('\n');
+    stack.splice(0,3); // HACK: we dont want 3 top most callers since they belong to our code
+    return stack;
+  };
+  var isInFileExcludeList = function(caller) {
+    var exclude;
+    for (var i = 0; i < fileExcludeList.length; i++) {
+      exclude = fileExcludeList[i];
+      if (caller.indexOf(exclude) !== -1) {
+        return true;
+      }
+    }
+    return false;
+  };
+  var removeUrlParams = function(fileline) {
+    var match = fileline.match(/(\?.*):/);
+    if (match) {
+      match = match.pop();
+      fileline = fileline.replace(match, "");
+    }
+    return fileline;
+  };
+  var getOrigFileLine = function() {
+    var stacktrace = getStacktrace();
+    var regex = /(file|http|https)\:\/\/.+?(\/.*:\d+):\d+/;
+    var match;
+    var fileline = "";
+    for (var i = 0; i < stacktrace.length; i++) {
+      caller = stacktrace[i];
+      if ((match = caller.match(regex)) && !isInFileExcludeList(caller)) {
+        fileline = match.pop();
+        fileline = removeUrlParams(fileline);
+        break;
+      }
+    }
+    return fileline;
+  };
+  var canSetFileLine = function(node,fileline) {
+    return typeof node.setAttribute !== "undefined" &&
+          !node.getAttribute("data-orig-file-line") &&
+          fileline.length > 0;
+  };
+  var setFileLineToElement = function(node,fileline) {
+    var child;
+    if (canSetFileLine(node, fileline)) {
+      node.setAttribute("data-orig-file-line", fileline);
+      for (var i = 0; i < node.children.length; i++) {
+        child = node.children[i];
+        setFileLineToElement(child, fileline);
+      }
+    }
+  };
+  var setFileLineOnCall = function(methodName) {
+    var method = Element.prototype[methodName];
+    Element.prototype[methodName] = function(){
+      method.apply(this, arguments);
+      var node = arguments[0];
+      var fileline = getOrigFileLine();
+      setFileLineToElement(node, fileline);
+      return node;
+    };
+  };
+  var getFileExcluseList = function() {
+    var list = document.getElementsByTagName("head")[0].getAttribute("data-orig-exclude-list");
+    list = list ? list.split(",") : [];
+    return list;
+  };
+  var enableViewInspect = function() {
+    fileExcludeList = getFileExcluseList();
+    for (var i = 0; i < DOM_INSERT_METHOD_NAMES.length; i++) {
+      var methodName = DOM_INSERT_METHOD_NAMES[i];
+      setFileLineOnCall(methodName);
+    }
+  };
+  enableViewInspect();
+})();

data/lib/view_inspect.rb CHANGED Viewed

@@ -3,8 +3,6 @@ require 'view_inspect/haml'
 module ViewInspect
   def self.enable
-    return unless allow_view_source_location?
     ERB.enable
     Haml.enable
   end

data/view_inspect.gemspec CHANGED Viewed

@@ -1,6 +1,8 @@
+require File.expand_path('../lib/view_inspect/version', __FILE__)
 Gem::Specification.new do |s|
   s.name = "view_inspect"
-  s.version = "0.1.0"
+  s.version = ViewInspect::VERSION
   s.required_rubygems_version = ">= 1.9.3"

metadata CHANGED Viewed

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: view_inspect
 version: !ruby/object:Gem::Version
-  version: 0.1.0
+  version: 0.2.0
 platform: ruby
 authors:
 - Reginald Tan
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2014-10-17 00:00:00.000000000 Z
+date: 2014-10-20 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: nokogiri
@@ -35,13 +35,16 @@ files:
 - .gitignore
 - Gemfile
 - LICENSE.txt
-- README.rdoc
+- README.markdown
 - Rakefile
-- VERSION
+- example/sample.html
 - lib/view_inspect.rb
 - lib/view_inspect/erb.rb
 - lib/view_inspect/haml.rb
+- lib/view_inspect/middleware.rb
 - lib/view_inspect/railtie.rb
+- lib/view_inspect/version.rb
+- lib/view_inspect/view_inspect.js
 - test/helper.rb
 - test/test_view_inspect.rb
 - view_inspect.gemspec

data/README.rdoc DELETED Viewed

@@ -1,31 +0,0 @@
-= View Inspect
-View Inspect shows you the source location of a client or server rendered DOM element.
-== Demo
-== Installation
-  group :development do
-    gem "view_inspect"
-  end
-== Warning
-  Don't run this on production. Preferably, you should only run this locally, not even on staging environments. View Inspect shows you the fullpath of your and back-end and front-end code. That is unless you dont mind people seeing things like /home/nandato/rails/app/releases/20131012158211/app/views/ganbatte/show.html.erb:2 in the HTML source
-== Support
-Server Side:
-  works with plain html, erb, haml
-Client Side:
-  works with plain Javascript, and tested with Backbone, Ember
-== Copyright
-Copyright (c) 2014 Reginald Tan. See LICENSE.txt for
-further details.

data/VERSION DELETED Viewed

	@@ -1 +0,0 @@
1	- 0.1.0