Updating 'paper-item's inside 'paper-listbox' by way of 'dom-repeat' and data binding fails

Note: This question is regarding an old version of polymer. Google engineers drive to make quick breaking updates to the polymer package coupled with the fact that at the time they weren't dogfooding it means that the issue is obsolete.

The initial data binding to variable journal_tags in the ready function works and I get the three options 'meeting', 'payment' and 'general_message' to show up. The problem arises when I try to introduce a new option by changing the 'new_tag' variable. 'new_tag' is changed by data binding in a different polymer element.

When the observer function 'add_new_tag' that monitors changes to 'new_tag' gets called these are the console logs:

0meeting
1payment
2general_message
3tada

Therefore 'journal-tags' is changed. But the problem is that the 'paper-item' options in the 'paper-listbox' remain the same initial 'meeting', 'payment', 'general_message', even though I expected changes to 'journal-tags' to add the 'tada' option.

This is the code:

<dom-module id="journal-entry">
  <template>
    <paper-dropdown-menu label="Choose tag">
        <paper-listbox class="dropdown-content">
            <template is="dom-repeat" items="{{journal_tags}}">
                <paper-item>
                    {{item.tag}}
                </paper-item>
            </template>
        </paper-listbox>
    </paper-dropdown-menu>
    <paper-textarea label="journal_entry_text_area">
    </paper-textarea>
  </template>
  <script>
  (function() {
    'use strict';

    Polymer({
      is: 'journal-entry',
        properties:{
            new_tag:{
                type:String,
                notify:true,
                observer:'add_new_tag'
            },
            journal_tags:{
                type:Object,
                notify:true
            }
        },
        ready : function(){
            this.journal_tags=[
                {tag:'meeting'},
                {tag:'payment'},
                {tag:'general_message'}
            ];
        },
        add_new_tag : function(){
            this.journal_tags.push({tag:this.new_tag});
            for(var i=0;i<this.journal_tags.length;i++){
                console.log(i + this.journal_tags[i].tag);
            }
            //this.journal_tags.sort();
        }
    });
  })();
  </script>
</dom-module>

I just found out that changing arrays should be made by way of special polymer functions that enable notifications to be sent that enable data binding to function, as per https://www.polymer-project.org/1.0/docs/devguide/properties#array-mutation. Therefore the fix is simple and is made by changing the line:

this.journal_tags.push({tag:this.new_tag});

to

this.push('journal_tags',{tag:this.new_tag});