Visibility of outputs of individually run workflow nodes after being deselected and selected again.

[bekhruz-ti]

Self Checks

• This is only for bug report, if you would like to ask a quesion, please head to Discussions.
• I have searched for existing issues search for existing issues, including closed ones.
• I confirm that I am using English to submit this report (我已阅读并同意 Language Policy).
• Pleas do not modify this template :) and fill in all the required fields.

Dify version

0.6.66

Cloud or Self Hosted

Cloud and Self Hosted Docker

Steps to reproduce

1. Add a node to your workflow. Ideally, choose a node that takes a few seconds to execute. For example, a custom code block with the following function:

import time 
def main() -> dict:
    time.sleep(3)
    return {
        "result": 'arg1 + arg2',
    }

2. Trigger it via the Run This Step -> Start run functionality which allows triggering one node at a time

3. Click on a different node either while it's executing or after it has finished executing.
4. Select the initial node again.

Can be reproduced in cloud and self host (docker)

✔️ Expected Behavior

I should be able to see the output of that node individually run node once I reselect it.

❌ Actual Behavior

If I run a single node and deselect it before it finishes executing or after it finishes executing, and then select it again, the output of the node along with all its metrics are no longer visible.

[dosubot]

To address the issue where the output of a node is not visible after deselecting and then reselecting it in Dify version 0.6.66, it's important to focus on how the nodeInfo.expand property and the collapseState state are managed within your application. The visibility of the node's details is controlled by these, and ensuring they are correctly updated is key to resolving the problem.

First, verify that the nodeInfo.expand property is correctly set to true when a node is reselected. This property influences the collapseState, which determines the visibility of the node's details. The relationship between nodeInfo.expand and collapseState is established through a useEffect hook, which sets collapseState based on the negated value of nodeInfo.expand. If nodeInfo.expand does not accurately reflect the user's actions (deselecting and reselecting a node), the expected behavior might not occur.

useEffect(() => {
  setCollapseState(!nodeInfo.expand)
}, [nodeInfo.expand])

Ensure that any logic related to updating nodeInfo.expand accurately reflects the user's interactions with the UI. If the issue persists, consider adding debugging logs within the useEffect hook to trace how nodeInfo.expand changes and ensure that these changes trigger the expected updates to collapseState.

useEffect(() => {
  console.log(`nodeInfo.expand changed to: ${nodeInfo.expand}`); // Debugging log
  setCollapseState(!nodeInfo.expand);
}, [nodeInfo.expand]);

This approach will help you identify if there are any unexpected behaviors or timing issues affecting the visibility of the node's details. Testing these changes in both cloud and self-hosted environments will ensure that the solution is effective across all deployment types.

Details

Sources

• web/app/components/workflow/run/node.tsx
• web/app/components/workflow/hooks/use-nodes-interactions.ts

About Dosu
This response is meant to be useful and save you time. It is not meant to be a precise solution, but rather a starting point for your own research.

Help me be more useful! Please leave a 👍 if this is helpful and 👎 if it is irrelevant.

To continue the conversation, mention @dosu.