Updated Profile page (#726)

* Updated Profile page

* Updates in Profile page

* - test updates, bug fixes for empty elements

Co-authored-by: Shaun Maharaj <Shaun.Maharaj@elasticpath.com>

Author: petro97

src/containers/ProfilePage.tsx

@@ -159,7 +159,7 @@ class ProfilePage extends React.Component<RouteComponentProps, ProfilePageState>
 
   renderShippingAddress() {
     const { profileData } = this.state;
-    if (profileData && profileData._addresses[0]._shippingaddresses && profileData._addresses[0]._shippingaddresses[0]._selector[0]._chosen) {
+    if (profileData && profileData._addresses && profileData._addresses[0]._shippingaddresses && profileData._addresses[0]._shippingaddresses[0]._selector && profileData._addresses[0]._shippingaddresses[0]._selector[0]._chosen) {
       const selectedAddress = profileData._addresses[0]._shippingaddresses[0]._selector[0]._chosen[0]._description[0].address;
       const selectedAddressName = profileData._addresses[0]._shippingaddresses[0]._selector[0]._chosen[0]._description[0].name;
       return (
@@ -189,7 +189,7 @@ class ProfilePage extends React.Component<RouteComponentProps, ProfilePageState>
 
   renderBillingAddress() {
     const { profileData } = this.state;
-    if (profileData && profileData._addresses[0]._billingaddresses && profileData._addresses[0]._billingaddresses[0]._selector[0]._chosen) {
+    if (profileData && profileData._addresses && profileData._addresses[0]._billingaddresses && profileData._addresses[0]._billingaddresses[0]._selector && profileData._addresses[0]._billingaddresses[0]._selector[0]._chosen) {
       const selectedAddress = profileData._addresses[0]._billingaddresses[0]._selector[0]._chosen[0]._description[0].address;
       const selectedAddressName = profileData._addresses[0]._billingaddresses[0]._selector[0]._chosen[0]._description[0].name;
       return (

src/containers/b2b/AddressBookPage.tsx

@@ -101,8 +101,8 @@ class AddressBookPage extends React.Component<AddressBookPageProps, AddressBookP
       const profileData = await res.json();
       if (profileData && profileData._defaultprofile) {
         const addressData = profileData._defaultprofile[0]._addresses[0];
-        const chosenBillingAddress = addressData._billingaddresses[0]._selector[0]._chosen && addressData._billingaddresses[0]._selector[0]._chosen[0]._description[0].self.uri;
-        const chosenShippingAddress = addressData._shippingaddresses[0]._selector[0]._chosen && addressData._shippingaddresses[0]._selector[0]._chosen[0]._description[0].self.uri;
+        const chosenBillingAddress = addressData._billingaddresses[0]._selector && addressData._billingaddresses[0]._selector[0]._chosen && addressData._billingaddresses[0]._selector[0]._chosen[0]._description[0].self.uri;
+        const chosenShippingAddress = addressData._shippingaddresses[0]._selector && addressData._shippingaddresses[0]._selector[0]._chosen && addressData._shippingaddresses[0]._selector[0]._chosen[0]._description[0].self.uri;
         this.setState({
           profileData: addressData,
           chosenBillingUri: chosenBillingAddress,
@@ -141,9 +141,9 @@ class AddressBookPage extends React.Component<AddressBookPageProps, AddressBookP
     const newOrEdit = (addressData && addressData.addressUri) ? intl.get('edit') : intl.get('new');
     const isChosenBilling = chosenBillingUri === (addressData && addressData.addressUri);
     const isChosenShipping = chosenShippingUri === (addressData && addressData.addressUri);
-    let selectactionShippingUri = addressData && profileData._shippingaddresses[0]._selector[0]._choice
+    let selectactionShippingUri = addressData && profileData._shippingaddresses[0]._selector && profileData._shippingaddresses[0]._selector[0]._choice
       && profileData._shippingaddresses[0]._selector[0]._choice.find(el => addressData.addressUri === el._description[0].self.uri);
-    let selectactionBillingUri = addressData && profileData._billingaddresses[0]._selector[0]._choice
+    let selectactionBillingUri = addressData && profileData._billingaddresses[0]._selector && profileData._billingaddresses[0]._selector[0]._choice
       && profileData._billingaddresses[0]._selector[0]._choice.find(el => addressData.addressUri === el._description[0].self.uri);
     selectactionShippingUri = selectactionShippingUri && selectactionShippingUri._selectaction[0].self.uri;
     selectactionBillingUri = selectactionBillingUri && selectactionBillingUri._selectaction[0].self.uri;

src/tests/e2e/profile.test.js

@@ -269,6 +269,9 @@ describe('Profile', () => {
     await page.click(MY_PROFILE);
 
     // Then I can see my addresses
+    await page.waitFor(3000);
+    await page.waitForSelector(EDIT_ADDRESS_BUTTON);
+    await page.click(EDIT_ADDRESS_BUTTON);
     await page.waitForSelector(ADDRESS_STREET_NAME);
     const element = await page.$(ADDRESS_STREET_NAME);
     const text = await page.evaluate(el => el.textContent, element);