App displays blank screen when migrating from a previous version

[nonfungibletunji]

Issue Description

The latest release 1.15 produces a blank screen on initial load.

javascript error logged in the browser console. TypeError: undefined is not an object (evaluating 'this.props.shop.name')

Steps to Reproduce

Please provide starting context, i.e. logged in as a user, configure a particular payment method.

Push To Heroku Button

1. Hit push to Heroku button
2. Fill in the the required coif var
3. The page loads a blank screen

or

Reaction Docker Compose Up

or

reaction command line

Possible Solution

Not obligatory, but suggest a fix/reason for the bug

Versions

1.15

[spencern]

I'm running the latest release and just started the app using docker-compose up and am not seeing this issue. Are you seeing any server errors? Do you have any custom plugins installed?

[nonfungibletunji]

undefined is not an object (evaluating 'this.props.shop.name')

[dancastellon]

@stunjiturner Is this a fresh install, or are you trying to upgrade from an earlier version?

[nonfungibletunji]

Fresh download zip 10 minutes ago, as well as upgraded existing app and the deploy to heroku button

[brent-hoover]

Just tried this from a fresh install (reaction init) and everything was fine but I did see it when trying to upgrade the swag shop site to 1.15.0. Have not dug in deeper yet

[nonfungibletunji]

@zenweasel have you tried the deploy to heroku button? That’s not working either and that’s independent of my developer work environment? I will investigate on a new machine

[brent-hoover]

Looks like this happens if I:

1. Do a fresh clone
2. Check out v.14.1
3. Start the app
4. Stop the app
5. Check out v1.15.0
6. rm -rf node_modules && meteor npm install
7. Start the app

So it is probably missing a migration somewhere?

[brent-hoover]

I don't see any errors in either client or server though. Just completely blank.

[brent-hoover]

Resetting the db fixes it so it's probably a migration issue.

[nonfungibletunji]

Reaction reset -n ?

S Tunji Turner sightuary @sightuary

On Aug 28, 2018, at 11:54 PM, Brent Hoover notifications@github.com wrote:

Resetting the db fixes it so it's probably a migration issue.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.

[brent-hoover]

@stunjiturner yes

[nonfungibletunji]

I can confirm that a fresh install is possible, using

rm -rf node_modules && meteor npm install reaction reset -n reaction

still nothing using 1.15 and latest swag-shop, anybody test the deploy to heroku?

error:

undefined is not an object (evaluating 'this.props.shop.name') in js file, at method

                                renderShopSelect()
                                {
                                    return this.props.handleShopSelectChange ? s.createElement(u, {
                                        className: "shop-select",
                                        isTagNav: !0,
                                        onShopSelectChange: this.onShopSelectChange,
                                        shopName: this.props.shop.name,
                                        shops: this.props.shops,
                                        shopId: this.props.shop._id
                                    }) : null
                                }

[brent-hoover]

Testing the "Deploy to Heroku" button I see the same behavior that @stunjiturner was seeing (blank screen + errors in console). You can see this URL here for now: https://infinite-headland-32258.herokuapp.com/

[spencern]

@stunjiturner The error you're seeing seems to suggest that the shop is not available when running renderShopSelect - I'm curious if this is dependent on swag-shop. That would seem likely if not for @zenweasel's finding that deploy to heroku is also failing, I'm assuming without the swag shop?

[nonfungibletunji]

On my test app I removed the renderShopSelect calls from the JavaScript files that call the method and I still get a blank screen. ?

S Tunji Turner sightuary @sightuary

On Aug 30, 2018, at 11:15 AM, Spencer Norman notifications@github.com wrote:

@stunjiturner The error you're seeing seems to suggest that the shop is not available when running renderShopSelect - I'm curious if this is dependent on swag-shop. That would seem likely if not for @zenweasel's finding that deploy to heroku is also failing, I'm assuming without the swag shop?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.

[brent-hoover]

@spencern The Heroku deploy was just stock Reaction without the swag shop. Which seems strange because there is no "migration" going on and a stock reaction init works fine so possibly there is more than one issue going on. Because when I tested a migration I didn't get the error that @stunjiturner was seeing but I did get a completely blank screen. 🤔

[spencern]

@zenweasel I agree, it seems that perhaps we have multiple issues here. I don't think this is specifically a "production" issue as we've been deploying a staging version for the past several releases and that still works. I'm not seeing any issues running reaction within a docker container without the swag shop, but clearly something is off that's causing the client app not to render.

[brent-hoover]

@spencern It might be a "production" issue if users can't migrate from one version to another. It's actually blocking me from deploying the latest release to the demo site.

[spencern]

Sure, what I meant by that is that it's not necessarily an issue that's only seen in code that's been bundled for production

[griggheo]

One more observation here: I have also noticed the blank page issue when I run 1.15 with the catalog sample dataset from the starterkit.

[griggheo]

Actually this happens with the dev dataset as well.

[nonfungibletunji]

Any feedback on this issue from core team, I have a free day next week for this issue alone, if pointed in the correct direction

[brent-hoover]

I think @aldeed has a handle on this and you should probably see a fix coming down shortly. https://github.com/reactioncommerce/reaction/issues/4608

[aldeed]

@stunjiturner If you need a quick fix, paste this in server startup code and it should fix it:

    import { Packages, Shops } from "/lib/collections";

    Packages.rawCollection().update({
      "layout.structure.template": "products"
    }, {
      $set: {
        "layout.$[elem].structure.template": "Products"
      }
    }, {
      arrayFilters: [{ "elem.structure.template": "products" }],
      multi: true
    });

    Packages.rawCollection().update({
      "registry.template": "products"
    }, {
      $set: {
        "registry.$[elem].template": "Products"
      }
    }, {
      arrayFilters: [{ "elem.template": "products" }],
      multi: true
    });

    Shops.rawCollection().update({
      "layout.structure.template": "products"
    }, {
      $set: {
        "layout.$[elem].structure.template": "Products"
      }
    }, {
      arrayFilters: [{ "elem.structure.template": "products" }],
      multi: true
    });

You can then delete it after it has run once against your database in each environment. We'll also put together a patch adding this migration if you want to wait for that.