aotf: editable mutations

[oliver-sanders]

Addresses #339
Follow-on from: #504
Companion Cylc Flow PR: cylc/cylc-flow#3986 - merged

Example showing the trigger mutation being called, first using the configured defaults, then by edit.

Requirements check-list

• I have read CONTRIBUTING.md and added my name as a Code Contributor.
• Contains logically grouped changes (else tidy your branch by rebase).
• Does not contain off-topic changes (use other PRs for other changes).
• Appropriate tests are included (unit and/or functional).
• Appropriate change log entry included.
• No documentation update required.

[oliver-sanders]

Spotted two issues so far.

1. The broadcast mutation is getting a 400 return code.
   • Checked the mutation/args, looks good, not sure what's going on.
2. The workflow state can get stuck sometimes (not related to this PR).
   • Try holding and releasing it a few times, the play/pause button and GScan indicator should change.
   • However, sometimes they don't.
   • I have replicated this in GraphiQL so looks like this is Flow/UIS related.
   • Opened: flow state stuck cylc-uiserver#165

[oliver-sanders]

Fixed the broadcast issue by treating broadcast settings in a specially, requires cylc/cylc-flow#3986.

[codecov-io]

Codecov Report

Merging #544 (cd42bea) into master (b7dfc4a) will decrease coverage by 22.26%.
The diff coverage is 28.57%.

@@             Coverage Diff             @@
##           master     #544       +/-   ##
===========================================
- Coverage   82.80%   60.54%   -22.27%     
===========================================
  Files          66       68        +2     
  Lines        1320     1366       +46     
  Branches       81       88        +7     
===========================================
- Hits         1093      827      -266     
- Misses        208      510      +302     
- Partials       19       29       +10     

Flag	Coverage Δ
e2e	60.54% <28.57%> (+11.82%)	⬆️
unittests	?

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files	Coverage Δ
src/components/cylc/tree/TreeItem.vue	96.15% <ø> (ø)
src/components/cylc/workflow/Toolbar.vue	22.22% <0.00%> (-69.45%)	⬇️
.../components/graphqlFormGenerator/FormGenerator.vue	43.47% <ø> (-39.14%)	⬇️
src/components/graphqlFormGenerator/FormInput.vue	80.00% <ø> (+10.43%)	⬆️
...aphqlFormGenerator/components/BroadcastSetting.vue	0.00% <0.00%> (ø)
...omponents/graphqlFormGenerator/components/Enum.vue	0.00% <0.00%> (ø)
...omponents/graphqlFormGenerator/components/List.vue	0.00% <ø> (-33.34%)	⬇️
...ponents/graphqlFormGenerator/components/Object.vue	0.00% <ø> (-100.00%)	⬇️
src/graphql/queries.js	100.00% <ø> (ø)
src/services/workflow.service.js	0.00% <0.00%> (ø)
... and 37 more

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update b7dfc4a...cd42bea. Read the comment docs.

[oliver-sanders]

I've added some dummy mutations to the mocked workflow service so they can now be tested in offline mode and the first functional test, will test the mutation forms etc in due course.

[kinow]

@oliver-sanders I can write the tests for this one if you'd like? I just remembered how to use Cypress & write e2e tests working on #555 (slowly switching from vacation-mode to work-mode 😄).

That way you can focus on other issues.

[oliver-sanders]

That's a very kind offer, thanks. Just realised I hadn't committed on this PR since November 🤦.

I had added some mock-mutations for the offline mode and had started writing tests for them but was running into issues running older Cypress on MacOS (had to quit and restart Cypress for every change which made the test development process painfully slow).

[kinow]

That's a very kind offer, thanks. Just realised I hadn't committed on this PR since November facepalm.

I had added some mock-mutations for the offline mode and had started writing tests for them but was running into issues running older Cypress on MacOS (had to quit and restart Cypress for every change which made the test development process painfully slow).

Ah! So you should be able to finish the tests, hopefully without having to wait so much after #555 🤞

[oliver-sanders]

... one month later 🤦

Rebased, got back to the tests...

The good news is that Cypress has worked like a charm since the upgrade, seriously impressive project 👏!

I've added functional tests to test that cylc-objects (cycle point, families, tasks, ...) are associated with mutations correctly.

Now I'm having a go at capturing $workflowService.mutate calls to test that the mutations are being executed correctly. I'm not quite sure how to mock the workflow service for this purpose, I've had a go at this:

  it('fires the mutation when clicked', () => {
    cy.visit('/#/workflows/one')

    const mutations = []
    cy.window().its('app').then(app => {
      // Object.getPrototypeOf(app.$workflowService).mutate = (stuff) => {
      app.$workflowService.mutate = (stuff) => {
        mutations.push(stuff) // add the mutation arguments to an array for later comparison
        console.log('here')
      }
    })

    // open the mutations panel
    cy
      .get('.node-data-cyclepoint > .c-task:first')
      .should('exist')
      .should('be.visible')
      .click()

    // run the first mutation in the list
    cy
      .get('.c-mutation-menu-list:first')
      .find('.v-list-item__content:first')
      .should('exist')
      .should('be.visible')
      .click()
      .then(() => {
        // ensure the mutation would have been executed
        expect(mutations).to.deep.equal([])
      })
  })

No luck with that approach :(

[kinow]

Does it work?

    cy.window().its('app.$workflowService').then(service => {
      // Object.getPrototypeOf(app.$workflowService).mutate = (stuff) => {
      cy.stub(service, 'mutate', () => {
        mutations.push(stuff) // add the mutation arguments to an array for later comparison
        console.log('here')
      })
    })

There's an example in the e2e test layout.js.

[oliver-sanders]

Ah, need to mock the workflowService.apolloClient.mutate method not workflowService.mutate...

[kinow]

Ah, need to mock the workflowService.apolloClient.mutate method not workflowService.mutate...

Looks like you're almost done! It'll be great to have this PR merged. All mutations available from within the UI. I think you should be able to use .stub to modify the apolloClient too: https://docs.cypress.io/api/commands/stub.html#Syntax

[oliver-sanders]

Stub looks nice, thanks for the pointer, I think the apolloClient isn't defined so I couldn't easily use stub, however, the test is pretty simple so I was able to get away with just service.apolloClient = { mutate () => {} }.

Will come back to the unit tests tomorrow, hopefully get this finished soon 😓.

[kinow]

Looks like CI is ok now! 🚀

[oliver-sanders]

Sorted out the play/pause and stop buttons in the toolbar!

The toolbar now sets an internal flag when it "mutates" a property and unsets that when the state changes. This property is then used to deactivate the buttons.

Note:

• This is a temporary solution until we have the ability to subscribe to mutation progress.
• Sometimes mutations fail or don't have the desired effect due to the timing of the request.
• So the buttons aren't deactivated, they are just greyed out, clicking them again will repeat the request.

[kinow]

Half-way through the code. Then review with a couple running workflows. But should finish reviewing it this morning or this afternoon 🎉 Looking great so far!

[kinow]

Few comments in the code, but no blockers. No need to update the code @oliver-sanders, mainly comments here and there. Tested UI + UIServer with couple workflows. Worked like a charm! Set outputs, release, hold, kill tasks. Also play/pause/stop workflow. 👏 and great tests!

I think for later we probably want a confirmation message before stopping workflows. WDYT @oliver-sanders @hjoliver ? I accidentally stopped my workflow during the tests 😄

[oliver-sanders]

Thanks @kinow, good suggestions.

Prompting on actions is something we need to look at, for example the cylc clean command should definitely prompt.

In Cylc8 the "stop" button is now safe 🥳, you can always press "play" and everything will return to the way it was, so the need for a prompt on the stop button is much less than it was before. Trying to remember the Cylc7 GUI, I don't think we prompt for the stop button (but do for control => stop, which is equivalent to the new mutation editor).

[hjoliver]

LGTM, had a good play with it 👍