udnp/issue-safari-use-strict-and-object-defineproperty.md

## issue-safari-use-strict-and-object-defineproperty.md

      
    Raw
  

              issue-safari-use-strict-and-object-defineproperty.md
            
          
    [Proof Code] Issue of Safari ES5 strict mode and Object.defineProperty() with a named setter function

Issue


On iOS 9.3.2 Safari, it seems that Object.defineProperty() including a named setter function with a same named argument causes something problem in the ES5 strict mode.
And then, JavaScript in this strict mode scope dose not work, but any error or exception not be thrown.
If 'use strict'; line in the script is removed, this problem dose not occurre.
Other browsers(Chrome, Firefox) and Node.js do not have this issue.

Proof Code


main.js ... main code to causes this issue
result.html ... HTML to run main code and show its result in this

iOS 9.3.2 Safari Result

JavaScript dose not work, and nothing shown.
Expected Result

Island
Another island


## main.js
/*
 * [Proof Code]
 * Safari ES5 strict mode issue for Object.defineProperty() with a named setter function
 * reference: https://robertnyman.com/javascript/javascript-getters-setters.html#object-defineproperty
*/
'use strict';

var lost = {
  loc : "Island"
};

Object.defineProperty(lost, "location", {
  get : function location() {
    return this.loc;
  },
  set : function location(location) {
    this.loc = location;
  }
});

// call getter
console.log(lost.location);
// => Island

// call setter
lost.location = "Another island";
console.log(lost.location);
// => Another island

## result.html
<!DOCTYPE html>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>console.log HTML</title>
<textarea readonly style="position:absolute;top:0;right:0;bottom:0;left:0;width:96%;height:98%;margin:auto;"></textarea>
<script>
'use strict';
console.log = (function() {
  var initialized = false;
	var header = '';
  var log = console.log;

  header += '# ' + new Date() + '\n';
	header += '# UA: ' + navigator.userAgent + '\n';
	header += '#';

	return function(s) {
    if(!initialized) {
      _log(header);
      initialized = true;
    }

    _log(s);

    function _log(s) {
      log.apply(console, arguments);
      document.querySelector('textarea').textContent += (s + '\n');
    }
	};
})();
</script>
<script src="main.js"></script>
	/*
	* [Proof Code]
	* Safari ES5 strict mode issue for Object.defineProperty() with a named setter function
	* reference: https://robertnyman.com/javascript/javascript-getters-setters.html#object-defineproperty
	*/
	'use strict';

	var lost = {
	loc : "Island"
	};

	Object.defineProperty(lost, "location", {
	get : function location() {
	return this.loc;
	},
	set : function location(location) {
	this.loc = location;
	}
	});

	// call getter
	console.log(lost.location);
	// => Island

	// call setter
	lost.location = "Another island";
	console.log(lost.location);
	// => Another island
	<!DOCTYPE html>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>console.log HTML</title>
	<textarea readonly style="position:absolute;top:0;right:0;bottom:0;left:0;width:96%;height:98%;margin:auto;"></textarea>
	<script>
	'use strict';
	console.log = (function() {
	var initialized = false;
	var header = '';
	var log = console.log;

	header += '# ' + new Date() + '\n';
	header += '# UA: ' + navigator.userAgent + '\n';
	header += '#';

	return function(s) {
	if(!initialized) {
	_log(header);
	initialized = true;
	}

	_log(s);

	function _log(s) {
	log.apply(console, arguments);
	document.querySelector('textarea').textContent += (s + '\n');
	}
	};
	})();
	</script>
	<script src="main.js"></script>