diff --git a/js/src/html/tokenizer.js b/js/src/html/tokenizer.js
index d9373ae26..8cd9d70fb 100644
--- a/js/src/html/tokenizer.js
+++ b/js/src/html/tokenizer.js
@@ -71,7 +71,7 @@ var Tokenizer = function(input_string, options) {
     handlebars_open: pattern_reader.until(/[\n\r\t }]/),
     handlebars_raw_close: pattern_reader.until(/}}/),
     comment: pattern_reader.starting_with(/<!--/).until_after(/-->/),
-    cdata: pattern_reader.starting_with(/<!\[cdata\[/).until_after(/]]>/),
+    cdata: pattern_reader.starting_with(/<!\[CDATA\[/).until_after(/]]>/),
     // https://en.wikipedia.org/wiki/Conditional_comment
     conditional_comment: pattern_reader.starting_with(/<!\[/).until_after(/]>/),
     processing: pattern_reader.starting_with(/<\?/).until_after(/\?>/)
@@ -125,24 +125,24 @@ Tokenizer.prototype._get_next_token = function(previous_token, open_token) { //
   token = token || this._read_raw_content(c, previous_token, open_token);
   token = token || this._read_close(c, open_token);
   token = token || this._read_content_word(c);
-  token = token || this._read_comment(c);
+  token = token || this._read_comment_or_cdata(c);
+  token = token || this._read_processing(c);
   token = token || this._read_open(c, open_token);
   token = token || this._create_token(TOKEN.UNKNOWN, this._input.next());
 
   return token;
 };
 
-Tokenizer.prototype._read_comment = function(c) { // jshint unused:false
+Tokenizer.prototype._read_comment_or_cdata = function(c) { // jshint unused:false
   var token = null;
   var resulting_string = null;
   var directives = null;
 
   if (c === '<') {
     var peek1 = this._input.peek(1);
-    //if we're in a comment, do something special
     // We treat all comments as literals, even more than preformatted tags
-    // we just look for the appropriate close tag
-    if (c === '<' && (peek1 === '!' || peek1 === '?')) {
+    // we only look for the appropriate closing marker
+    if (peek1 === '!') {
       resulting_string = this.__patterns.comment.read();
 
       // only process directive on html comments
@@ -153,8 +153,6 @@ Tokenizer.prototype._read_comment = function(c) { // jshint unused:false
         }
       } else {
         resulting_string = this.__patterns.cdata.read();
-        resulting_string = resulting_string || this.__patterns.conditional_comment.read();
-        resulting_string = resulting_string || this.__patterns.processing.read();
       }
     }
 
@@ -167,6 +165,27 @@ Tokenizer.prototype._read_comment = function(c) { // jshint unused:false
   return token;
 };
 
+Tokenizer.prototype._read_processing = function(c) { // jshint unused:false
+  var token = null;
+  var resulting_string = null;
+  var directives = null;
+
+  if (c === '<') {
+    var peek1 = this._input.peek(1);
+    if (peek1 === '!' || peek1 === '?') {
+      resulting_string = this.__patterns.conditional_comment.read();
+      resulting_string = resulting_string || this.__patterns.processing.read();
+    }
+
+    if (resulting_string) {
+      token = this._create_token(TOKEN.COMMENT, resulting_string);
+      token.directives = directives;
+    }
+  }
+
+  return token;
+};
+
 Tokenizer.prototype._read_open = function(c, open_token) {
   var resulting_string = null;
   var token = null;
@@ -272,7 +291,7 @@ Tokenizer.prototype._read_raw_content = function(c, previous_token, open_token)
     if (tag_name === 'script' || tag_name === 'style') {
       // Script and style tags are allowed to have comments wrapping their content
       // or just have regular content.
-      var token = this._read_comment(c);
+      var token = this._read_comment_or_cdata(c);
       if (token) {
         token.type = TOKEN.TEXT;
         return token;
diff --git a/js/test/generated/beautify-html-tests.js b/js/test/generated/beautify-html-tests.js
index fbf343821..6747308e9 100644
--- a/js/test/generated/beautify-html-tests.js
+++ b/js/test/generated/beautify-html-tests.js
@@ -416,6 +416,7 @@ function run_html_tests(test_obj, Urlencoded, js_beautify, html_beautify, css_be
         // Tests for script and style Commented and cdata wapping (#1641)
         reset_options();
         set_name('Tests for script and style Commented and cdata wapping (#1641)');
+        opts.templating = 'php';
         bth(
             '<style><!----></style>',
             //  -- output --
@@ -565,6 +566,26 @@ function run_html_tests(test_obj, Urlencoded, js_beautify, html_beautify, css_be
             '         console.log("</script>" + "</style>");\n' +
             '    ]]>\n' +
             '</script>');
+        
+        // Issue #1687 - start with <?php ?>
+        bth(
+            '<script>\n' +
+            '<?php ?>\n' +
+            'var b={\n' +
+            'a:function _test( ){\n' +
+            'return 1;\n' +
+            '}\n' +
+            '}\n' +
+            '</script>',
+            //  -- output --
+            '<script>\n' +
+            '    <?php ?>\n' +
+            '    var b = {\n' +
+            '        a: function _test() {\n' +
+            '            return 1;\n' +
+            '        }\n' +
+            '    }\n' +
+            '</script>');
 
 
         //============================================================
diff --git a/test/data/html/tests.js b/test/data/html/tests.js
index 5b21aa689..b744cdb21 100644
--- a/test/data/html/tests.js
+++ b/test/data/html/tests.js
@@ -217,6 +217,9 @@ exports.test_data = {
   }, {
     name: "Tests for script and style Commented and cdata wapping (#1641)",
     description: "Repect comment and cdata wrapping regardless of beautifier",
+    options: [
+      { name: "templating", value: "'php'" }
+    ],
     tests: [{
       input: [
         '<style><!----></style>'
@@ -405,6 +408,28 @@ exports.test_data = {
         '    ]]>',
         '</script>'
       ]
+    }, {
+      comment: "Issue #1687 - start with <?php ?>",
+      input: [
+        '<script>',
+        '<?php ?>',
+        'var b={',
+        'a:function _test( ){',
+        'return 1;',
+        '}',
+        '}',
+        '</script>'
+      ],
+      output: [
+        '<script>',
+        '    <?php ?>',
+        '    var b = {',
+        '        a: function _test() {',
+        '            return 1;',
+        '        }',
+        '    }',
+        '</script>'
+      ]
     }]
   }, {
     name: "Tests for script and style types (issue 453, 821)",