bihealth / sodar-server

SODAR: System for Omics Data Access and Retrieval
https://github.com/bihealth/sodar-server
MIT License
14 stars 3 forks source link

Upgrade major Vue app dependencies for v0.15 #1972

Closed mikkonie closed 3 months ago

mikkonie commented 3 months ago

It seems the problems in #1971 are due to a complex web of node dependency issues. I should just do a full update on the packages. This is a major milestone after all.

I'll try to ensure to the best of my capability that this doesn't create any nasty surprises.. That means in addition to the tests, I'll manually test it around and ensure everything's ok in CI and staging.

And lest we forget, Vue2 is at EOL and we need to do #994 soon.

mikkonie commented 3 months ago

Initial attempt not very promising. App builds and appears to work at a glance, but tests exhibit several failures:

Summary of all failing tests
 FAIL  tests/unit/OntologyEditModal.spec.js (13.15 s)
  ● OntologyEditModal.vue › renders term search options

    expect(received).toBe(expected) // Object.is equality

    Expected: 4
    Received: 0

      455 |
      456 |     const termOptions = wrapper.find('#sodar-ss-ontology-select-term').findAll('Option')
    > 457 |     expect(termOptions.length).toBe(4)
          |                                ^
      458 |
      459 |     for (let i = 0; i < ontologyTermResponseHp.terms.length; i++) {
      460 |       const term = ontologyTermResponseHp.terms[i]

      at Object.<anonymous> (tests/unit/OntologyEditModal.spec.js:457:32)

  ● OntologyEditModal.vue › renders search option for an obsolete term

    expect(received).toBe(expected) // Object.is equality

    Expected: 1
    Received: 0

      483 |
      484 |     const termOptions = wrapper.find('#sodar-ss-ontology-select-term').findAll('Option')
    > 485 |     expect(termOptions.length).toBe(1)
          |                                ^
      486 |     expect(termOptions.at(0).text()).toContain('<OBSOLETE>')
      487 |   })
      488 |

      at Object.<anonymous> (tests/unit/OntologyEditModal.spec.js:485:32)

  ● OntologyEditModal.vue › inserts new term from option selection

    [vue-test-utils]: no item exists at 0

      502 |     expect(termItems.length).toBe(3)
      503 |     const termOptions = wrapper.find('#sodar-ss-ontology-select-term').findAll('Option')
    > 504 |     await termOptions.at(0).trigger('dblclick')
          |                       ^
      505 |     await waitNT(wrapper.vm)
      506 |     await waitRAF()
      507 |

      at throwError (node_modules/@vue/test-utils/dist/vue-test-utils.js:1700:9)
      at WrapperArray.at (node_modules/@vue/test-utils/dist/vue-test-utils.js:8528:5)
      at Object.<anonymous> (tests/unit/OntologyEditModal.spec.js:504:23)

  ● OntologyEditModal.vue › handles option selection of existing term

    [vue-test-utils]: no item exists at 0

      532 |     expect(termItems.length).toBe(3)
      533 |     const termOptions = wrapper.find('#sodar-ss-ontology-select-term').findAll('Option')
    > 534 |     await termOptions.at(0).trigger('dblclick')
          |                       ^
      535 |     await waitNT(wrapper.vm)
      536 |     await waitRAF()
      537 |

      at throwError (node_modules/@vue/test-utils/dist/vue-test-utils.js:1700:9)
      at WrapperArray.at (node_modules/@vue/test-utils/dist/vue-test-utils.js:8528:5)
      at Object.<anonymous> (tests/unit/OntologyEditModal.spec.js:534:23)

  ● OntologyEditModal.vue › replaces existing term with disallowed list value

    [vue-test-utils]: no item exists at 0

      614 |     expect(termItems.length).toBe(1)
      615 |     const termOptions = wrapper.find('#sodar-ss-ontology-select-term').findAll('Option')
    > 616 |     await termOptions.at(0).trigger('dblclick')
          |                       ^
      617 |     await waitNT(wrapper.vm)
      618 |     await waitRAF()
      619 |

      at throwError (node_modules/@vue/test-utils/dist/vue-test-utils.js:1700:9)
      at WrapperArray.at (node_modules/@vue/test-utils/dist/vue-test-utils.js:8528:5)
      at Object.<anonymous> (tests/unit/OntologyEditModal.spec.js:616:23)

  ● OntologyEditModal.vue › inserts term with disallowed list value

    [vue-test-utils]: no item exists at 0

      646 |
      647 |     const termOptions = wrapper.find('#sodar-ss-ontology-select-term').findAll('Option')
    > 648 |     await termOptions.at(0).trigger('dblclick')
          |                       ^
      649 |     await waitNT(wrapper.vm)
      650 |     await waitRAF()
      651 |

      at throwError (node_modules/@vue/test-utils/dist/vue-test-utils.js:1700:9)
      at WrapperArray.at (node_modules/@vue/test-utils/dist/vue-test-utils.js:8528:5)
      at Object.<anonymous> (tests/unit/OntologyEditModal.spec.js:648:23)

 FAIL  tests/unit/ColumnToggleModal.spec.js (13.955 s)
  ● ColumnToggleModal.vue › filters fields on onFilterInput()

    expect(received).toBe(expected) // Object.is equality

    Expected: true
    Received: false

      208 |       expect(fields.at(i).isVisible()).toBe(false)
      209 |     }
    > 210 |     expect(fields.at(6).isVisible()).toBe(true) // Treatment is true
          |                                      ^
      211 |   })
      212 |
      213 |   it('calls onColumnChange() on column hide/show click', async () => {

      at Object.<anonymous> (tests/unit/ColumnToggleModal.spec.js:210:38)

 FAIL  tests/unit/IrodsDirModal.spec.js
  ● IrodsDirModal.vue › renders object list with irods object data

    expect(received).toBe(expected) // Object.is equality

    Expected: true
    Received: false

      64 |     expect(wrapper.findAll('.sodar-ss-request-delete-btn').length).toBe(1)
      65 |     expect(wrapper.findAll('.sodar-ss-request-cancel-btn').length).toBe(1)
    > 66 |     expect(wrapper.find('.sodar-ss-irods-stats').isVisible()).toBe(true)
         |                                                               ^
      67 |   })
      68 |
      69 |   it('renders modal with empty object list', async () => {

      at Object.<anonymous> (tests/unit/IrodsDirModal.spec.js:66:63)

  ● IrodsDirModal.vue › updates list on onFilterUpdate()

    expect(received).toBe(expected) // Object.is equality

    Expected: true
    Received: false

      130 |     expect(wrapper.findAll('.sodar-ss-irods-obj').length).toBe(2)
      131 |     expect(wrapper.findAll('.sodar-ss-irods-obj').at(0).isVisible()).toBe(false)
    > 132 |     expect(wrapper.findAll('.sodar-ss-irods-obj').at(1).isVisible()).toBe(true)
          |                                                                      ^
      133 |     await wrapper.vm.onFilterUpdate('')
      134 |     expect(wrapper.findAll('.sodar-ss-irods-obj').at(0).isVisible()).toBe(true)
      135 |     expect(wrapper.findAll('.sodar-ss-irods-obj').at(1).isVisible()).toBe(true)

      at Object.<anonymous> (tests/unit/IrodsDirModal.spec.js:132:70)

  ● IrodsDirModal.vue › displays no results row for filtering

    expect(received).toBe(expected) // Object.is equality

    Expected: true
    Received: false

      170 |     expect(wrapper.find('#sodar-ss-irods-filter-empty').exists()).toBe(false)
      171 |     expect(wrapper.findAll('.sodar-ss-irods-obj').length).toBe(2)
    > 172 |     expect(wrapper.findAll('.sodar-ss-irods-obj').at(0).isVisible()).toBe(true)
          |                                                                      ^
      173 |     expect(wrapper.findAll('.sodar-ss-irods-obj').at(1).isVisible()).toBe(true)
      174 |     await wrapper.vm.onFilterUpdate('jee8ITh2')
      175 |     expect(wrapper.find('#sodar-ss-irods-filter-empty').exists()).toBe(true)

      at Object.<anonymous> (tests/unit/IrodsDirModal.spec.js:172:70)
mikkonie commented 3 months ago

Problems and fixes in unit tests:

mikkonie commented 3 months ago

Done. That was annoying.