Meteor.status().status not reactive?

Could anybody help me understand why Meteor.status() isn’t reactive in this React component?

import React from 'react';
import ReactMixin from 'react-mixin';
import { ReactMeteorData } from 'meteor/react-meteor-data';

import { GlassCard } from '/imports/ui/components/GlassCard';
import { CardTitle, CardText } from 'react-toolbox/lib/card';
import TextField from 'material-ui/TextField';
import {orange500, blue500} from 'material-ui/styles/colors';

export class AppInfoPage extends React.Component {
  constructor(props) {
  getMeteorData() {
    let data = {
      environment: process.env.NODE_ENV,
      userId: Meteor.userId(),
      url: Meteor.absoluteUrl(),
      onlineStatus: Meteor.status().status

    return data;
      <div id="appInfoPage">
              title="App Info"
                errorText="Universal Resource Location"
              /><br />
              /><br />
                errorText="User ID"
              /><br />
              /><br />

ReactMixin(AppInfoPage.prototype, ReactMeteorData);

The UI renders before the livedata connection gets established, and then doesn’t refresh once the connection is established. I would have thought that, as a reactive data source, Meteor.status() would trigger getMeteorData() to refresh the React render tree.

Instead, it’s just stuck on ‘connecting’.

Huh. When I navigate around the app, it will detect changes. So, if I go to another page, and then come back to the AppInfoPage, it will rerender with a connected status. So the React UI seems to be pulling from Meteor.status() rather than being pushed to.

Definitely not real-time/reactive.


Did you find the cause/fix for this?

Came to the exact same issue and wondering how to fix it.

Actually, we didn’t. If you find a solution, we’d be keen on any recommendations you might be willing to share.

What we did find was that updating based on page navigation was a ‘good enough’ solution. Not ideal. But it does a fair job of detecting when the server crashes; even if it doesn’t detect network hiccups.

Will share.

Haven’t found anything yet. I thought wrapping it in the createContainer might do the trick but the status simply does not get passed down as a prop for whatever reason :confused:

Huh. I just took another look, and it’s reactive now. But the code on the page looks all the same.

Maybe a dependency got updated? Or something in the dependency tree was blocking network status from being reactive? I know I’ve rebuilt the project a number of times since posting this thread; and have even synced the whole thing to GitHub and cloned new copies of it.

Maybe delete the node_modules folder, do a meteor reset and meteor update and rebuild the dependency tree?

Cheers, will experiment and let you know! FIngers crossed…

Yup confirmed working.

I’m simply doing something wrong with how I’m passing down props from my root component (which is getting the reactive status prop but not passing it down to its children):

					{React.cloneElement(this.props.children, {...this.props} )}