title: How update local storage in all opened tab
body: <p>I'm storing all my data in browser local storage and have class named <code>Cart</code> to manage the data in the local storage.</p>
  
  <pre class="lang-js prettyprint-override"><code>class Cart{
      constructor(){
          this._token = 'fafacart_items';
  
          this._items = null;
  
  
          this._orderId = null;
  
          this._shipping = {
              id: null,
              city: null,
              type: 'post',
              name: '',
              mobile: '',
              email: '',
              address: '',
              postcode: '',
              national_code: ''
          };
  
          this._coupon = {
              active: false
          };
  
          this._paymentMethod = 'online';
  
          this._validation = null;
  
          // this.restore();
  
          window.addEventListener('storage', this.restore())
      }
  
   restore(){
          var stored = Storage.getItem(this._token);
          console.log(stored)
          if(stored){
              this._items = stored.items;
              this._shipping = Object.assign({}, this._shipping,   stored.shipping);
              this._coupon = Object.assign({}, this._coupon, stored.coupon);
              this._paymentMethod = stored.paymentMethod;
              this._validation = stored.validation;
              this.orderId = stored.orderId;
          } else {
              this._items = [];
          }
  
          if(this._items.length == 0)
              this.valid = true;
      }
  
  
  }
  </code></pre>
  
  <p>I have an other class named <code>CartHolder</code> that show all data in local storage.
  It had an global event for listen action button named <code>add-to-cart</code>
  after this method execute update the local storage on browser.</p>
  
  <pre class="lang-js prettyprint-override"><code>export default class CartHolder extends Component {
      constructor(props) {
          super(props);
  
          this.state = {
              cart: null
          };
  
          this.restore = this.restore.bind(this);
      }
  
      componentWillMount(){
          if(this.props.paid){
              Cart.empty();
          }
  
          this.listen('add-to-cart', product =&gt; {
              Cart.add(product);
  
              this.restore();
          });
  
          this.restore();
      }
  
      restore(){
          this.setState({cart: Cart});
      }
  }
  </code></pre>
  
  <p>when the local storage is updated I can not see the data on the other browser tab is opened before and  I just see the data in current tab and with refresh the other tabs I can see the data on them.</p>
  
  <p>I want to see updated local storage data in other tabs with out refreshing or reloading the browser tabs</p>