es2-postprocessor

Post processor for legacy DHTML browsers.

---

Check for JavaScript Syntax Errors in IE <5.5 and Opera <8.0. Some syntax is rewritten. Otherwise, throws an SyntaxError.

Work around JavaScript engine bug in Gecko <=0.8.0.

Usage

const es2PostProcessor = require('es2-postprocessor');

sourceForLegacyBrowsers = es2PostProcessor(source, {minIEVersion: 5, minOperaVersion: 7, minGeckoVersion: 0.6});

gulp plugin

gulp.task('post_process_for_ie5_and_opera7',
    function(){
        return gulp.src('main.js')
                   .pipe(
                       require('es2-postprocessor').gulp({minIEVersion: 5, minOperaVersion: 7, minGeckoVersion: 0.6})
                   ).pipe(
                       gulp.dest('dist/js/legacy')
                   );
    }
);

gulp + es2-postprocessor + Google Closure Compiler

When formatting code with Google Closure Compiler.

gulp.task('post_process_for_ie5_and_opera7',
    function(){
        return gulp.src('main.js')
                   .pipe(
                       require('es2-postprocessor').gulp({minIEVersion: 5, minOperaVersion: 7, minGeckoVersion: 0.6})
                   .pipe(
                       require('google-closure-compiler').gulp()(
                           {
                               compilation_level : 'WHITESPACE_ONLY', // Prevent replacing labeled blocks.
                               formatting        : 'PRETTY_PRINT', // or 'SINGLE_QUOTES'
                               js_output_file    : 'main.es2.js'
                           }
                       )
                   ).pipe(
                       gulp.dest('dist/js/legacy')
                   );
    }
);

Options

Property	Description	Default value
minIEVersion	Set to 4 if you want to fix syntax errors or warnings that occurs in IE4.	5.5
minOperaVersion	Set to 7 if you want to fix syntax errors or warnings that occurs in Opera 7.	8.0
minGeckoVersion	Set to 0.6 if you want to work around a bug that occurs in Gecko ~0.8.0.	0.9
clone	Set to true if you want to compare the before and after code.	false

ECMAScript3 Syntax Support Table

	Example	IE	Opera	Gecko
instanceof operator	obj instanceof Object	5(*1)	✔	✔
try statement, catch statement, throw	try{}catch(O_o){}	5(*1)	✔	✔
in operator	"length" in []	5.5(*1)	✔	✔
Labeled Statement Block	a: {break a;}	✔	7.5(*2)	✔
Object Literal with Numeric Property	{1: 1}	5.5(*3)	✔	✔
RegExp Literal	/reg/	✔	✔	✔
RegExp Literal with i g Flags	/reg/ig	✔	✔	✔
RegExp Literal with m Flag	/reg/m	5.5(*1)	✔	✔

1. Just throw a Syntax Error
2. Opera ~7.2x does not support Labeled Statement Block. Therefore, es2-postprocessor rewrite for workaround. If it is too complicated, throws an error.
3. Rewrite for workaround.

Bugs in JavaScript implementation

	Example	IE	Opera	Gecko
Object Literal with Empty String Property	{"": ""}	✔	8(*1)	✔
Function expression under parentheses	function c(){};(function(){c()})()	✔	✔	0.8.1(*2)

1. Throw a Syntax Error. Object Literal with Empty String Property is problematic in Opera 7.x.
2. Gecko ~0.8.0 has a bug in Function expression under parentheses. Therefore, es2-postprocessor rewrite for workaround. It can be tested with the "Javascript 実装状況と深刻なバグ > IIFE".

Object Literal with Empty String Property in Opera ~7.2x.

obj = {"":"Good!"} //  Object Literal
obj[""] // == undefined
obj["0"] // == "Good!"

obj[""] = "Good!"; // Set empty string property
obj[""] // == "Good!"

It can be tested with the "Javascript 実装状況と深刻なバグ > Object Litearl".

Dynamic Rewriting escodegen

es2-postprocessor Rewrite line 814 of escodegen. This is being done dynamically.

result = parenthesize(generateVerbatimString(verbatim), Precedence.Sequence, precedence);
// ↓
result = generateVerbatimString(verbatim);

Links

1. es2-postprocessorでOpera8未満、IE5.5未満でも動くJavaScriptを書く
2. エイプリルフール企画などでレガシーブラウザ対応する場合に覚えておきたい最初期のDHTMLブラウザのJavaScriptの罠たちを回避する

License

es2-postprocessor is licensed under MIT License.

(C) 2022-2023 itozyun(outcloud.blogspot.com)