[Vuejs]-I am using dot notation to access my object values that are being pushed to a list but it is not working. WHY?

This actually appears to be working: https://codepen.io/aprouja1/pen/rwvYyV

Only thing changed in the Codepen is creating the Vue instance and selecting the #app element.

Vue.use(VueMaterial)

const app = new Vue( {
  name: "app",
  el:"#app",
  data: function() {
    return {
      contacts: []
    }
  },
  methods: {
    fillTable: function() {
      this.contacts.push({
        firstname: "Sebastian",
        lastname: "Escheiler",
        email: "s.eschweiler@mail.com"
      });

      this.contacts.push({
        firstname: "Bill",
        lastname: "Smith",
        email: "b.smith@mail.com"
      });

      this.contacts.push({
        firstname: "Ann",
        lastname: "Parker",
        email: "a.parker@mail.com"
      });
    },

    clearTable: function() {
      this.contacts.splice(0, this.contacts.length);
    }
  }
});