Magento_Customer/js/customer-data empty on the first page after login

[AymericJoubert]

Customer data is empty on the first page after login.
Related to closed issue #13984, with more steps to reproduce.

Preconditions (*)

1. PHP 7.2
2. Magento Community 2.3.0 with sample datas

Steps to reproduce (*)

1. Install sample datas
2. Make sur that all caches are enabled
3. Create a js script that is placed on every page; It should at least contain:

define([
    'jquery',
    'Magento_Customer/js/customer-data',
    'domReady!'
], function ($, customerData) {
    'use strict';
    var customer = customerData.get('customer');
    console.log(customer());
});

4. Go on frontend and create an account
5. Go on a product page, %base_url%/driven-backpack.html for exemple
6. Click on "Sign In" in the top bar of the page and fill login form with created account
7. You are redirected on driven-backpack product page, and console.log(customer()); gives "{}" in console
8. Press F5, console.log(customer()); gives right infos in console

Expected result (*)

1. The customer is populated on the first page after login

Actual result (*)

1. Customer data is empty and id populated on the second page after login

[magento-engcom-team]

Hi @AymericJoubert. Thank you for your report.
To help us process this issue please make sure that you provided the following information:

• Summary of the issue
• Information on your environment
• Steps to reproduce
• Expected and actual results

Please make sure that the issue is reproducible on the vanilla Magento instance following Steps to reproduce. To deploy vanilla Magento instance on our environment, please, add a comment to the issue:

@magento-engcom-team give me 2.3-develop instance - upcoming 2.3.x release

For more details, please, review the Magento Contributor Assistant documentation.

@AymericJoubert do you confirm that you was able to reproduce the issue on vanilla Magento instance following steps to reproduce?

• yes
• no

[AymericJoubert]

@magento-engcom-team give me 2.3-develop instance

[magento-engcom-team]

Hi @AymericJoubert. Thank you for your request. I'm working on Magento 2.3-develop instance for you

[magento-engcom-team]

Hi @AymericJoubert, here is your Magento instance.
Admin access: https://i-21548-2-3-develop.instances.magento-community.engineering/admin
Login: admin Password: 123123q
Instance will be terminated in up to 3 hours.

[AymericJoubert]

Can't reproduce it without adding provided piece of javascript, and need sample datas

[Ctucker9233]

@magento-engcom-team Same or similar issue here on 2.2.7. In my case, it cases infinite loading of a product page due to failure of loading customer data.

[Ctucker9233]

@magento-engcom-team give me 2.2.7 instance with sample data and frontend access

[magento-engcom-team]

Hi @Ctucker9233. Thank you for your request. I'm working on Magento 2.2.7 instance for you

[magento-engcom-team]

Hi @Ctucker9233, here is your Magento instance.
Admin access: https://i-21548-2-2-7.instances.magento-community.engineering/admin
Login: admin Password: 123123q
Instance will be terminated in up to 3 hours.

[AymericJoubert]

So what's the roadmap about this issue ?

[orlangur]

@AymericJoubert expected result is wrong, customer data is loaded asynchronously. You can add observable on it to perform some logic when customer data is loaded.

[mareckigit]

Try something like this:
customer.subscribe(function (_customer) { console.log(_customer); }, this);

[elvinristi]

subscription to customer data is not being executed when Local Storage has mage-cache-storage: {}

@AymericJoubert give a try to following patch

--- view/frontend/web/js/customer-data.js.org	2019-08-21 18:03:30.682111847 +0200
+++ view/frontend/web/js/customer-data.js	2019-08-21 18:08:12.738262086 +0200
@@ -202,10 +202,10 @@
                 expiredSectionNames = this.getExpiredSectionNames(),
                 isLoading = false;

-            if (privateContent &&
+            if ((privateContent &&
                 !$.cookieStorage.isSet(privateContentVersion) &&
                 !$.localStorage.isSet(privateContentVersion)
-            ) {
+            ) || (privateContent === null && localPrivateContent === null)) {
                 $.cookieStorage.set(privateContentVersion, needVersion);
                 $.localStorage.set(privateContentVersion, needVersion);
                 this.reload([], false);

I could reproduce this following way:

• open Chrome console > Application
• clean Local Storage and Cookies for the domain
• re-open start page/PLP

[lawsann]

Hello. I'm a new programmer in Magento 2, but I want to give my contribution to the post. Maybe I'm not providing the best solution, but could help someone.

The data stored by the customerData js feature could be updated asynchronously and explicitly registering a subscriber solve the problem pointed by AymericJoubert. Using the code that he posted, add the following:

define([
    'jquery',
    'Magento_Customer/js/customer-data',
    'domReady!'
], function ($, customerData) {
    'use strict';
    var customer = customerData.get('customer');
    customer.subscribe(function (updatedCustomer)
    {
        console.log(updatedCustomer);
    }, this);
});

So, that way, when the customer data is updated, our widget or component receive the updated data and could does our logic verifications. It solved the problem to me of not verifying correctly the customer data on the first page load after login, because that code run asynchronously when the data is updated.

Hope that helps.