0

I'm working my way through the Discover Meteor tutorial and an annoying problem keeps popping up. When I use the console to change app data, the app doesn't update automagically for reactive data sources as promised. Not sure what is going on. Here's an example to illustrate the problem (and to figure out whether it's the code itself or something else).

Initialize app and include underscore and iron router:

meteor create testApp
meteor add underscore
meteor add iron:router

Create the following file structure:

.
└── testApp
   ├── .meteor
   |  └── [meteor auto generated files]
   ├── lib
   |  └── router.js
   └── client
      ├── layout.html
      ├── layout.js
      ├── main.html
      └── pageone.html

router.js

Router.configure({
    layoutTemplate: 'layout',
});
Router.route('/', {name:'pageone'});

layout.html

<template name="layout">
    <div class="container">
        <header class="navbar navbar-default" role="navigation"> 
      <div class="navbar-header">
        <a class="navbar-brand" href="{{pathFor 'pageone'}}">{{pageTitle}}</a>
      </div>
    </header>
    <div id="main">
      {{> yield}}
    </div>
    </div>
</template>

layout.js

Template.layout.helpers({
  pageTitle: function() { return Session.get('pageTitle') || "placeholder"; }
});

main.html

<head>
    <title>testApp2</title>
</head>

pageone.html

<template name="pageone">
  <div class="message">
    <h1>Test App for SO</h1>
  </div>
</template>

Now run the app from the testApp directory using the meteor command and navigate to localhost:3000 in the browser.

Now type Session.set('pageTitle', 'New Title'); into the console.

I am using Chrome and when I do this, the terminal window where I'm monitoring the meteor server prints out Client modified -- refreshing. However, nothing happens, even though the Session object is supposed to be reactive. Then, if I refresh the tab, I get a blank screen and have to restart the meteor server manually if I want to get my app to work again.

Does anyone know what's going on here?

jdw
  • 3,755
  • 3
  • 17
  • 16
  • 1
    @Kyll. I've added an MCVE as you suggested. Hopefully that makes things clearer. – jdw Jun 22 '15 at 05:07

3 Answers3

0

When I search your repository for Session.get I can't find any hit, so you are not using any Session variables... https://github.com/dantzlerwolfe/microscope/search?q=Session.get

Try this to get your example to work and reconsider what you do with domain. Thats not how meteor works...

Template.postItem.helpers({
    name: function() {
        return Session.get('pageTitle');
    }
});
CFrei
  • 3,552
  • 1
  • 15
  • 29
  • I've added an MCVE as suggested by Kryll above. Even when I add the helper, I am still getting the same problem. Can you recreate the issue based on what I've provided in my edits? – jdw Jun 22 '15 at 05:08
0

Well, I have checked the repository and all works fine. Except changing page title - but it is not supposed to.

Mind, that in layout.html you have specified helper pageTitle but you have not specified the function. (I assume, that you thought that you can simply access session variables inside a template). In layout.js you have to create a new helper called pageTitle that returns the session variable. Like so:

Template.layout.helpers({
    pageTitle: function(){
        return Session.get("pageTitle");
    }
})
Adam Wolski
  • 5,448
  • 2
  • 27
  • 46
  • I've added an MCVE as suggested by Kryll above. Even when I add the helper, I am still getting the same problem. Can you recreate the issue based on what I've provided in my edits? – jdw Jun 22 '15 at 05:08
0

This is a "problem" with Chrome's console itself. Actually (and I feel dumb now) console has completely separate settings from the browser.

  1. Open the console
  2. Click on the gear icon.
  3. Make sure the "disable javascript" box is not checked.

Now you should be able to modify your app from the console. See THIS SO Q&A for more details.

Community
  • 1
  • 1
jdw
  • 3,755
  • 3
  • 17
  • 16