Test: expand/collapse && get tests working in development cycle

[Sigfried]

Overview

Expand/collapse has broken for the umpteenth time. I just fixed it again last week. We need a test for it.

Not obvious to me if this should be playwright, jest or both. But I wish I had been alerted when it got broken.

@joeflack4: did I see an update from you about expand/collapse?

Anyway, this is an opportunity, before I fix it again, to fix it using TDD.

Playwright approach/advantage: This is a UI thing. At minimum, test clicking expand on a concept, affirm that the icon changes to minus and child concepts appear; test clicking collapse, affirm that icon changes to plus and child concepts disappear.

Jest: Easier and quicker to run; could more easily run continuously during development instead of waiting for commit/push. Taking code from second useEffect in CsetComparisonPage component maybe test looks like this:

Sub-tasks

• [x] @joeflack4 explore codeless UI test generation
  • Answer: npx playwright codegen URL
• [ ] UI/E2E / Playwright tests
• [ ] Jest tests
• [ ] @Sigfried Get tests working in development cycle
  • [ ] #867
  • [x] #868

Details

let [graphOptions, graphOptionsDispatch] = useGraphOptions();
let graphData = <this comes from test case>;

function graphRender() {
    let gc = new GraphContainer(graphData);
    let newGraphOptions = gc.setGraphDisplayConfig(graphOptions);
    gc.getDisplayedRows(newGraphOptions);
    newGraphOptions = gc.setGraphDisplayConfig(graphOptions);
    graphOptionsDispatch({ type: 'REPLACE', graphOptions: newGraphOptions });
}
graphRender();
graphOptionsDispatch({
    gc,
    type: 'TOGGLE_NODE_EXPANDED',
    nodeId: <concept_id>,
    direction: 'expand'
});
graphRender();

Confirm:

• gc.displayedRows contains 's children below
• graphOptions.specificNodesExpanded contains

graphOptionsDispatch({
    gc,
    type: 'TOGGLE_NODE_EXPANDED',
    nodeId: <concept_id>,
    direction: 'collapse'
});
graphRender();

Confirm:

• gc.displayedRows does not contain 's children below
• graphOptions.specificNodesExpanded does not contain

Also, graphOptions.specificNodesCollapsed will now contain , but should it? No...see, writing test is already useful. Undoing a row expansion should just mean removing it from specificNodesExpanded. And row collapse should only occur if something was non-specifically expanded, like by expand all or one of the show-though-hidden options. I put todo items for this in AppState.graphOptionsReducer.TOGGLE_NODE_EXPANDED.

[joeflack4]

@joeflack4: did I see an update from you about expand/collapse?

@Sigfried All that comes to mind is this one, which you already fixed (thanks!):

• 866

[joeflack4]

Not obvious to me if this should be playwright, jest or both

IDK the underlying code well enough to say so for Jest, but playwright for sure.

[joeflack4]

@Sigfried IDK if it's too late for us to do this, but Tricia gave approval (assuming less than <$200 by Nov, the figure I quoted for her), for us if we want to use a service that can help us generate UI tests:

E.g.: https://www.datadoghq.com/dg/synthetics/continuoustesting-b

She said that if we do it, ideally pay before 9/25 (easier cuz grants / IOs changing).

[Sigfried]

If you'd be getting it running, yes, seems great.

I think we still need unit/algorithm tests.

Also I think we should better organize our test cases/data and tests. I have some ideas.

[Sigfried]

@joeflack4: It's been a while since I've worked on testing stuff. Can we get some of this started on a pair programming session? I'm free till 1pm today.