add data test to shipping (#590)

StoriqaTeam · Sep 25, 2018 · f826d3c · f826d3c
1 parent 288698c
commit f826d3c
Show file tree

Hide file tree

Showing 8 changed files with 65 additions and 34 deletions.
diff --git a/src/components/common/InputPrice/CurrencySelect.js b/src/components/common/InputPrice/CurrencySelect.js
@@ -15,6 +15,7 @@ type PropsType = {
   currencies: Array<string>,
   currency: SelectItemType,
   onChangeCurrency: (item: SelectItemType) => void,
+  dataTest: string,
 };
 
 class CurrencySelect extends Component<PropsType, StateType> {
@@ -39,6 +40,7 @@ class CurrencySelect extends Component<PropsType, StateType> {
   };
 
   render() {
+    const { dataTest } = this.props;
     const { currency } = this.state;
     const currencies = map(
       item => ({ id: item, label: item }),
@@ -52,6 +54,7 @@ class CurrencySelect extends Component<PropsType, StateType> {
         items={currencies}
         activeItem={currency}
         onSelect={this.handleOnChange}
+        dataTest={dataTest}
       />
     );
   }

diff --git a/src/components/common/InputPrice/InputPrice.js b/src/components/common/InputPrice/InputPrice.js
@@ -26,6 +26,7 @@ type PropsType = {
   price: number,
   label?: string,
   align?: 'center' | 'left' | 'right',
+  dataTest: string,
 };
 
 class InputPrice extends Component<PropsType, StateType> {
@@ -104,7 +105,14 @@ class InputPrice extends Component<PropsType, StateType> {
   };
 
   render() {
-    const { currency, onChangeCurrency, label, align, inputRef } = this.props;
+    const {
+      currency,
+      onChangeCurrency,
+      label,
+      align,
+      inputRef,
+      dataTest,
+    } = this.props;
     const { price } = this.state;
     return (
       <AppContext.Consumer>
@@ -120,6 +128,7 @@ class InputPrice extends Component<PropsType, StateType> {
                 onBlur={this.handlePriceBlur}
                 value={price}
                 align={align}
+                dataTest={`${dataTest}Input`}
               />
             </div>
             {currency && (
@@ -133,6 +142,7 @@ class InputPrice extends Component<PropsType, StateType> {
                     currency={currency}
                     onChangeCurrency={onChangeCurrency}
                     currencies={directories.currencies}
+                    dataTest={`${dataTest}CurrencySelect`}
                   />
                 ) : (
                   <div styleName="fixCurrency">{currency.label}</div>

diff --git a/src/pages/Manage/Store/Products/Product/Shipping/FixPriceForm.js b/src/pages/Manage/Store/Products/Product/Shipping/FixPriceForm.js
@@ -140,13 +140,15 @@ class FixPriceForm extends PureComponent<PropsType, StateType> {
               items={services}
               activeItem={service}
               onSelect={this.handleOnSelectService}
+              dataTest={`shipping${inter ? 'Inter' : 'Local'}ServiceSelect`}
             />
           </div>
           <div styleName="inputPrice">
             <InputPrice
               onChangePrice={this.handlePriceChange}
               price={price}
               currency={currency}
+              dataTest={`shipping${inter ? 'Inter' : 'Local'}ServicePrice`}
             />
           </div>
         </div>
@@ -168,11 +170,16 @@ class FixPriceForm extends PureComponent<PropsType, StateType> {
             disabled={
               company ? withCompanySaveButtonDisabled : inter && !countries
             }
+            dataTest={`shipping${company ? 'Save' : 'Add'}CompanyButton`}
           >
             {company ? 'Save' : 'Add company'}
           </Button>
           {company && (
-            <button styleName="cancelButton" onClick={onRemoveEditableItem}>
+            <button
+              styleName="cancelButton"
+              onClick={onRemoveEditableItem}
+              data-test="shippingEditFormCancel"
+            >
               Cancel
             </button>
           )}

diff --git a/src/pages/Manage/Store/Products/Product/Shipping/InterShipping.js b/src/pages/Manage/Store/Products/Product/Shipping/InterShipping.js
@@ -117,15 +117,18 @@ class InterShipping extends Component<PropsType, StateType> {
               onChange={this.handleOnChangeRadioButton}
             />
           </div>
-          <div styleName="radioButton">
-            <RadioButton
-              inline
-              id="interShippingFixPrice"
-              label="Fixed, single price for all"
-              isChecked={isSelectedFixPrice}
-              onChange={this.handleOnChangeRadioButton}
-            />
-          </div>
+          {interAvailablePackages &&
+            !isEmpty(interAvailablePackages) && (
+              <div styleName="radioButton">
+                <RadioButton
+                  inline
+                  id="interShippingFixPrice"
+                  label="Fixed, single price for all"
+                  isChecked={isSelectedFixPrice}
+                  onChange={this.handleOnChangeRadioButton}
+                />
+              </div>
+            )}
         </div>
         <div styleName={classNames('form', { hidePlane: isSelectedWithout })}>
           <div

diff --git a/src/pages/Manage/Store/Products/Product/Shipping/LocalShipping.js b/src/pages/Manage/Store/Products/Product/Shipping/LocalShipping.js
@@ -59,14 +59,10 @@ class LocalShipping extends Component<PropsType, StateType> {
       pickupShipping,
       currency,
       onChangeShippingData,
-      localAvailablePackages,
       localShipping,
     } = props;
     const isSelectedPickup = Boolean(pickupShipping && pickupShipping.pickup);
-    const isSelectedWithout =
-      !localAvailablePackages ||
-      isEmpty(localAvailablePackages) ||
-      (isEmpty(localShipping) && !isSelectedPickup);
+    const isSelectedWithout = isEmpty(localShipping) && !isSelectedPickup;
 
     onChangeShippingData({
       pickup: {
@@ -85,10 +81,6 @@ class LocalShipping extends Component<PropsType, StateType> {
   }
 
   handleOnChangeRadioButton = (id: string) => {
-    const { localAvailablePackages } = this.props;
-    if (!localAvailablePackages || isEmpty(localAvailablePackages)) {
-      return;
-    }
     this.setState(
       {
         isSelectedWithout: id === 'withoutLocalShipping',
@@ -187,20 +179,24 @@ class LocalShipping extends Component<PropsType, StateType> {
                 onChangePrice={this.handleOnChangePickupPrice}
                 price={pickupPrice}
                 currency={pickupCurrency}
+                dataTest="shippingPickupPrice"
               />
             </div>
           </div>
-          <div
-            styleName={classNames('formWrap', {
-              coverPlane: isEmpty(remainingServices) && !isSelectedWithout,
-            })}
-          >
-            <FixPriceForm
-              currency={currency}
-              services={remainingServices}
-              onSaveCompany={onSaveCompany}
-            />
-          </div>
+          {localAvailablePackages &&
+            !isEmpty(localAvailablePackages) && (
+              <div
+                styleName={classNames('formWrap', {
+                  coverPlane: isEmpty(remainingServices) && !isSelectedWithout,
+                })}
+              >
+                <FixPriceForm
+                  currency={currency}
+                  services={remainingServices}
+                  onSaveCompany={onSaveCompany}
+                />
+              </div>
+            )}
           {!isEmpty(companies) && (
             <div styleName="companies">
               {map(

diff --git a/src/pages/Manage/Store/Products/Product/Shipping/LocalShipping.scss b/src/pages/Manage/Store/Products/Product/Shipping/LocalShipping.scss
@@ -98,3 +98,7 @@
   font-size: 14px;
   color: $color_red;
 }
+
+.emptyPackegesText + .error {
+  margin-top: 0;
+}
diff --git a/src/pages/Manage/Store/Products/Product/Shipping/Shipping.js b/src/pages/Manage/Store/Products/Product/Shipping/Shipping.js
@@ -52,7 +52,7 @@ class Shipping extends Component<PropsType, StateType> {
         price: 0,
       },
       withoutInter: Boolean(shipping && isEmpty(shipping.international)),
-      withoutLocal: Boolean(shipping && isEmpty(shipping.local)),
+      withoutLocal: !shipping.pickup.pickup,
     };
     props.onChangeShipping(this.state);
   }

diff --git a/src/pages/Manage/Store/Products/Product/Shipping/handlerShippingDecorator.js b/src/pages/Manage/Store/Products/Product/Shipping/handlerShippingDecorator.js
@@ -35,6 +35,7 @@ import type {
   ServiceType,
   ShippingType,
   AvailablePackageType,
+  PickupShippingType,
 } from './types';
 
 type PropsType = {
@@ -45,6 +46,7 @@ type PropsType = {
   localAvailablePackages: Array<AvailablePackageType>,
   interAvailablePackages: Array<AvailablePackageType>,
   onChangeShippingData: (data: ShippingChangeDataType) => void,
+  pickupShipping: PickupShippingType,
 };
 
 type StateType = {
@@ -58,7 +60,12 @@ export default (OriginalComponent: any, inter?: boolean) =>
   class HandlerShippingDecorator extends Component<PropsType, StateType> {
     constructor(props: PropsType) {
       super(props);
-      const { interShipping, localShipping, onChangeShippingData } = props;
+      const {
+        interShipping,
+        localShipping,
+        onChangeShippingData,
+        pickupShipping,
+      } = props;
       const companies = addIndex(map)(
         (item, idx) => this.makeCompany(item, idx),
         inter ? interShipping : localShipping,
@@ -71,7 +78,8 @@ export default (OriginalComponent: any, inter?: boolean) =>
         companies: checkedCompanies,
         inter,
         withoutInter: inter && isEmpty(checkedCompanies),
-        withoutLocal: !inter && isEmpty(checkedCompanies),
+        withoutLocal:
+          !inter && isEmpty(checkedCompanies) && !pickupShipping.pickup,
       });
 
       const remainingServices = inter