Vue.js Shopware 6，使用 vuetestutils 进行Jest 测试：渲染模板上的意外行为

这是仅描述相关段落的片断/幻想代码

Test/my-Component.spec.js

import { shallowMount, createLocalVue } from '@vue/test-utils';
import Vuex from 'vuex';

import stateMyPluginStore from '../my-component/state';
import stateProductDetail from '...' // the original state from Shopware
...

const product = {
    purchasePrices: [
        {
            net: 15
        }
    ]
};

const productComponent = function(id, purchasePriceNet = 0, purchaseUnitCount = 0, unitId = null) {
    let component = {
        id: 'component_product_ident_' + id,
        name: 'component_name_' + id,
        purchasePrices: [
            {
                net: purchasePriceNet
            }
        ],
        extensions: {
            productPriceConfigurator: {
                purchaseUnitCount: purchaseUnitCount
            }
        }
    }

    if(unitId) {
        component.unitId = unitId
    }

    return component;
}

describe('PriceConfiguratorPurchasePricesView', () => {
    const localVue = createLocalVue();
    localVue.use(Vuex);
    let wrapper = null;

    beforeEach(() => {
        Shopware.State.registerModule('swProductDetail', stateProductDetail)
        Shopware.State.registerModule('MyPluginStore', stateMyPluginStore)
    });

    afterEach(() => {
        Shopware.State.unregisterModule('MyPluginStore')
        Shopware.State.unregisterModule('swProductDetail')

        if(wrapper) {
            wrapper.destroy();
            wrapper = null;
        }
    });

    it('should update list', async () => {
        Shopware.State.commit(
            'swProductDetail/setProduct', {
                purchasePrices: [
                    {
                        net: 10
                    }
                ]
            }
        )
        Shopware.State.commit(
            'MyPluginStore/setProductComponents', [
                productComponent(2, 1.10, 1, 'unitId_2'),
            ]
        )
        wrapper = shallowMount(await Shopware.Component.build('my-plugin'), {
            localVue,
            mocks: {
                ...
            },
            stubs: {
                ...
            },
            provide: {
                validationService: {},
                repositoryFactory: {
                    create: (entity) => ({
                        search: () => {
                            if(entity === 'unit') {
                                const response = {
                                    total: 2
                                };
                                return Promise.resolve(response)
                            }
                        },
                        get: () => {
                            if(entity === 'unit') {
                                const response = {
                                    "translated": {
                                        "shortCode": "kg",
                                        "name": "Kilogramm",
                                        "customFields": {}
                                    }
                                };
                                return Promise.resolve(response)
                            }
                        }
                    })
                }
            },
        });
        await wrapper.setData({}).then(() => {})

        console.log(wrapper.html())
        expect(wrapper.findAll('fieldset').length).toEqual(1);
    });
})

测试配置的第一步是执行默认状态提交，以使一些数据可用.结果:

• console.log(wrapper.html())2.

<div class="sw-container" style="justify-items: stretch; align-items: stretch;" id="purchaseCalculatorTemplate"><br>
  <sw-skeleton-stub></sw-skeleton-stub>
</div>

• console.log(wrapper.html())2.

<div class="sw-container" style="justify-items: stretch; align-items: stretch;" id="purchaseCalculatorTemplate">
      <fieldset class="">
        <div class="sw-container container-input-fields" style="grid-template-columns: 3fr 1fr 3fr 1fr 3fr; justify-items: stretch; align-items: stretch;" data-product="component_product_ident_2">
          <div class="sw-container sw-field sw-block-field sw-contextual-field sw-field--number sw-field--default" style="justify-items: stretch; align-items: stretch;">
            <div class="sw-field sw-block-field sw-contextual-field sw-field--number is--disabled sw-field--default">
              <div class="sw-field__label">
                <!----> <label for="sumProductComponentUnitPurchase_0" class="">
                  ∑ ["terms.purchasePrice.name"] (["terms.net.name"])
                </label>
                <!---->
              </div>
              <div class="sw-block-field__block">
                <!----> <input id="sumProductComponentUnitPurchase_0" name="sumProductComponentUnitPurchase_0" type="text" placeholder="" disabled="disabled" autocomplete="off">
                <div class="sw-field__addition">
                  <!---->
                </div>
              </div>
              <!---->
              <!---->
            </div>
          </div>
        </div>
      </fieldset>
    </div>

Question如果设置为await wrapper.setData({}).then(() => {})，为什么包装器按预期呈现(使用可用的comit数据)only以及如何修复它？