Polymer build breaks when uglifying paper-filter-dialog

[fmaiolo]

When I try to run a polymer build after including the paper-filter-dialog, I get the following error:
polymer build
info: Preparing build...
info: Building application...
info: Generating build/unbundled...
info: Generating build/bundled...
warn: Unable to optimize .js file /{path to my project}/bower_components/paper-search/paper-filter-dialog.html_script_0.js
{ err:
{ message: 'SyntaxError: Unexpected token: name (this)',
filename: 0,
line: 131,
col: 5,
pos: 3154,
stack: 'Error\n at new JS_Parse_Error (eval at <anonymous> (/usr/local/lib/node_modules/polymer-cli/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:1545:18)\n at js_error (eval at <anonymous> (/usr/local/lib/node_modules/polymer-cli/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:1553:11)\n at croak (eval at <anonymous> (/usr/local/lib/node_modules/polymer-cli/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:2092:9)\n at token_error (eval at <anonymous> (/usr/local/lib/node_modules/polymer-cli/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:2100:9)\n at unexpected (eval at <anonymous> (/usr/local/lib/node_modules/polymer-cli/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:2106:9)\n at as_property_name (eval at <anonymous> (/usr/local/lib/node_modules/polymer-cli/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:2714:13)\n at eval (eval at <anonymous> (/usr/local/lib/node_modules/polymer-cli/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:2668:24)\n at eval (eval at <anonymous> (/usr/local/lib/node_modules/polymer-cli/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:2139:24)\n at expr_atom (eval at <anonymous> (/usr/local/lib/node_modules/polymer-cli/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:2619:35)\n at maybe_unary (eval at <anonymous> (/usr/local/lib/node_modules/polymer-cli/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:2795:19)' } }

I'm suspecting it has something to do with the bind function on the setTimeout call in open()

[ankon]

Generally we assume an ES6 environment, which means you may have to process code through babel-es2015. bind seems to be from ES5.1 (https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_objects/Function/bind#Specifications).

Can you share /{path to my project}/bower_components/paper-search/paper-filter-dialog.html_script_0.js so we can actually look at the code that the build sees?

[fmaiolo]

This is the script from the html file:

<script>

(function() {

	Polymer({
		is: 'paper-filter-dialog',

		/**
		 * Fired when the user requests to save the filter selection
		 *
		 * @event save
		 */

		properties: {
			/**
			 * All filters from which the user can choose
			 */
			filters: Array,
			/**
			 * All filters that have been selected by the user, e.g. `{ age: [ "child", "teen" ] }`
			 */
			selectedFilters: {
				type: Object,
				notify: true,
				value: {}
			},

			/**
			 * Text for the reset button. Use this property to localize the element.
			 */
			resetButton: {
				type: String,
				value: 'Reset'
			},

			/**
			 * Text for the save button. Use this property to localize the element.
			 */
			saveButton: {
				type: String,
				value: 'Save filters'
			},

			/**
			 * Label shown if no values are selected for a filter. Use this property to localize the element.
			 */
			noValuesLabel: {
				type: String,
				value: 'No filters yet'
			},

			/**
			 * Internal copy that is changed. Copied back to original variable only once the user clicks on [Apply]
			 */
			_selectedFilters: {
				type: Object,
				value: {}
			},
			_selectedFilter: Object,
			_selectedFilterValues: {
				type: Array,
				value: []
			}
		},

		// Public methods
		/**
		 * Opens the filter dialog
		 */
		open: function() {
			// Attach dialog to the body to ensure it's on top of all existing overlays
			// XXX - Known issue: this generates addEventListener errors from a11y
			Polymer.dom(document.body).appendChild(this);

			// Wait until dialog is added to the DOM (required for Safari)
			setTimeout(function() {
				this.$.dialog.open();

				// Clone selected filters, so it can be changed without touching the external property
				this._selectedFilters = Object.assign({}, this.selectedFilters);

				// @see https://github.com/PolymerElements/neon-animation/issues/60#issuecomment-152345020
				this.$.valuesList.fire('iron-resize');
			}.bind(this), 1);
		},

		close: function() {
			this.$.dialog.close();
		},

		/**
		 * Handles if the user taps on a filter
		 */
		_tapSelectFilter: function(e) {
			this.$.selector.select(e.model.filter);

			this._preselectFilterValues();
		},

		/**
		 * Separate function for unit testing
		 */
		_preselectFilterValues: function() {
			// Check all values that are selected
			var selectedValueIds = this._selectedFilters[this._selectedFilter.id];
			var isSelected = function(value) {
				return Boolean(selectedValueIds) && selectedValueIds.indexOf(value.id) >= 0;
			};
			this._selectedFilterValues = this._selectedFilter.values.map(function(value) {
				return Object.assign({}, value, {
					selected: isSelected(value)
				});
			});
		},
		_tapReset: function(e) {
			this._selectedFilters = {};
		},
		_tapApply: function(e) {
			this.selectedFilters = this._selectedFilters;

			this.fire('save');
		},
		_tapSelectValues: function(e) {
			// Captured IDs of the selected items
			const selectedValues = this._selectedFilterValues.filter(function(value) {
				return value.selected;
			}).map(function(value) {
				return value.id;
			});
			this._selectedFilters = Object.assign({}, this._selectedFilters, {
				[this._selectedFilter.id] : selectedValues
			});

			this.$.selector.deselect(this._selectedFilter);
		},

		/**
		 * True if any filter was set
		 * @param  {[type]} selectedFilters  [description]
		 * @return {[type]}                   [description]
		 */
		_hasSelectedFilters: function(selectedFilters) {
			// Iterate until we find a filter that is selected
			for (selectedFilter in selectedFilters) {
				if (selectedFilters[selectedFilter].length > 0) {
					return true;
				}
			}

			return false;
		},
		// Returns the concated names of the selected values for a specific filter
		_getSelectedValuesNames: function(filter, _selectedFilters) {
			var selectedValueIds = _selectedFilters[filter.id];
			if (!filter.values || !selectedValueIds) {
				return this.noValuesLabel;
			}

			// Capture names of all selected values
			var names = filter.values.filter(function(value) {
				// Only consider values that are selected
				return selectedValueIds.indexOf(value.id) >= 0;
			}).map(function(value) {
				// Capture name of the selected value
				return value.name;
			})

			return names.length > 0 ? names.join(', ') : this.noValuesLabel;
		},
	});

})();

</script>

I don't know if that answers the question.

[fmaiolo]

Again, the bind() thing is a guess