Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[🐞] fixSourcePaths doesn't handle paths that are suffixed with more information even though the sources and sourceRoot are correct #919

Open
maiieul opened this issue Dec 18, 2024 · 0 comments

Comments

@maiieul
Copy link

maiieul commented Dec 18, 2024

Hi, Qwik core team member here 👋 . I'm trying to get code coverage with cypress component testing to work in Qwik.

Logs and screenshots

code-coverage combined NYC options { 'report-dir': './coverage', reporter: [ 'cobertura', 'html' ], extension: [ '.js', '.cjs', '.mjs', '.ts', '.tsx', '.jsx', '.vue' ], excludeAfterRemap: false, cwd: './', extends: '@istanbuljs/nyc-config-typescript', 'check-coverage': true, include: [ 'src//*.ts', 'src//.tsx' ], exclude: [ 'cypress/**/.', '**/.d.ts', '/*.cy.tsx', '/.cy.ts' ] } +0ms
code-coverage parsed sent coverage +0ms
✓ should render ⭐ (59ms)
code-coverage parsed sent coverage +11ms
✓ should render 💣 (7ms)
code-coverage parsed sent coverage +10ms
✓ Debug coverage object (6ms)
code-coverage parsed sent coverage +86ms
✓ should count clicks (82ms)
code-coverage parsed sent coverage +227ms
code-coverage parsed sent coverage +2ms
code-coverage NYC file /Users/maieul/dev/playgrounds/qwik-coverage-repro/.nyc_output/out.json has 3 key(s) +2s
code-coverage 1 key /Users/maieul/dev/playgrounds/qwik-coverage-repro/src/components/example/example.tsx file path /Users/maieul/dev/playgrounds/qwik-coverage-repro/src/components/example/example.tsx +0ms
code-coverage 2 key /Users/maieul/dev/playgrounds/qwik-coverage-repro/src/components/example/example.tsx_ExampleTest_component_2RuRrW0S9gQ.js file path /Users/maieul/dev/playgrounds/qwik-coverage-repro/src/components/example/example.tsx_ExampleTest_component_2RuRrW0S9gQ.js +0ms
code-coverage 3 key /Users/maieul/dev/playgrounds/qwik-coverage-repro/src/components/example/example.tsx_ExampleTest_component_Fragment_button_onClick_5dWdEYGDp1Q.js file path /Users/maieul/dev/playgrounds/qwik-coverage-repro/src/components/example/example.tsx_ExampleTest_component_Fragment_button_onClick_5dWdEYGDp1Q.js +0ms
code-coverage in file /Users/maieul/dev/playgrounds/qwik-coverage-repro/.nyc_output/out.json all files are not found? false +0ms
code-coverage NYC file /Users/maieul/dev/playgrounds/qwik-coverage-repro/.nyc_output/out.json has 3 key(s) +0ms
code-coverage ⚠️ cannot find file /Users/maieul/dev/playgrounds/qwik-coverage-repro/src/components/example/example.tsx_ExampleTest_component_2RuRrW0S9gQ.js with hash c07536cfa8e72df4e6409c29e9fdabb60c4c94ae +0ms
code-coverage ⚠️ cannot find file /Users/maieul/dev/playgrounds/qwik-coverage-repro/src/components/example/example.tsx_ExampleTest_component_Fragment_button_onClick_5dWdEYGDp1Q.js with hash 9b24b9fd9bca72b8c18b94f9df735ea316dd628d +0ms
code-coverage calling NYC reporter with options { 'report-dir': '/Users/maieul/dev/playgrounds/qwik-coverage-repro/coverage', reporter: [ 'cobertura', 'html' ], extension: [ '.js', '.cjs', '.mjs', '.ts', '.tsx', '.jsx', '.vue' ], excludeAfterRemap: false, cwd: './', extends: '@istanbuljs/nyc-config-typescript', 'check-coverage': true, include: [ 'src/**/
.ts', 'src//*.tsx' ], exclude: [ 'cypress//.', '/*.d.ts', '/.cy.tsx', '**/.cy.ts' ], 'temp-dir': '/Users/maieul/dev/playgrounds/qwik-coverage-repro/.nyc_output', tempDir: '/Users/maieul/dev/playgrounds/qwik-coverage-repro/.nyc_output', reportDir: '/Users/maieul/dev/playgrounds/qwik-coverage-repro/coverage' } +3ms
code-coverage current working directory is /Users/maieul/dev/playgrounds/qwik-coverage-repro +1ms
code-coverage after reporting, returning the report folder name /Users/maieul/dev/playgrounds/qwik-coverage-repro/coverage +20ms
code-coverage Did not find final coverage file /Users/maieul/dev/playgrounds/qwik-coverage-repro/coverage/coverage-final.json +0ms

Versions

  • What is this plugin's version?
    3.13.9
  • What is the Cypress version?
    13.17.0
  • What is your operating system?
    macOS
  • What is the shell?
    fish
  • What is the Node version?
    22.2
  • What is the NPM version?
    10.7.0
  • How do you instrument your application?
    vite-plugin-istanbul
  • When running tests, if you open the web application in a regular browser and open DevTools, do you see window.__coverage__ object? Can you paste a screenshot?
    image
  • Is there a .nyc_output folder? Is there a .nyc_output/out.json file? Is it empty? Can you paste at least part of it so we can see the keys and file paths?
{
  "/Users/maieul/dev/playgrounds/qwik-coverage-repro/src/components/example/example.tsx": {
    "path": "/Users/maieul/dev/playgrounds/qwik-coverage-repro/src/components/example/example.tsx",
    "statementMap": {
      "0": {
        "start": {
          "line": 3,
          "column": 41
        },
        "end": {
          "line": 8,
          "column": 3
        }
      },
      "1": {
        "start": {
          "line": 3,
          "column": 79
        },
        "end": {
          "line": 3,
          "column": 139
        }
      }
    },
    "fnMap": {
      "0": {
        "name": "(anonymous_0)",
        "decl": {
          "start": {
            "line": 3,
            "column": 75
          },
          "end": {
            "line": 3,
            "column": 76
          }
        },
        "loc": {
          "start": {
            "line": 3,
            "column": 79
          },
          "end": {
            "line": 3,
            "column": 139
          }
        },
        "line": 3
      }
    },
    "branchMap": {},
    "s": {
      "0": 6,
      "1": 6
    },
    "f": {
      "0": 6
    },
    "b": {},
    "inputSourceMap": {
      "version": 3,
      "sources": [
        "/Users/maieul/dev/playgrounds/qwik-coverage-repro/src/components/example/example.tsx"
      ],
      "sourceRoot": "",
      "names": [],
      "mappings": ";;AAEA,OAAO,MAAM,4BAAc;;;;;IA4BxB"
    },
    "_coverageSchema": "1a1c01bbd47fc00a2c39e90264f33305004495a9",
    "hash": "f576f1a7906855f86a9c6a9a78b4ba3c6d66eb6c"
  },
  "/Users/maieul/dev/playgrounds/qwik-coverage-repro/src/components/example/example.tsx_ExampleTest_component_2RuRrW0S9gQ.js": {
    "path": "/Users/maieul/dev/playgrounds/qwik-coverage-repro/src/components/example/example.tsx_ExampleTest_component_2RuRrW0S9gQ.js",
    "statementMap": {
      "0": {
        "start": {
          "line": 7,
          "column": 49
        },
        "end": {
          "line": 60,
          "column": 1
        }
      },
      "1": {
        "start": {
          "line": 8,
          "column": 18
        },
        "end": {
          "line": 10,
          "column": 6
        }
      },
      "2": {
        "start": {
          "line": 11,
          "column": 27
        },
        "end": {
          "line": 15,
          "column": 5
        }
      },
      "3": {
        "start": {
          "line": 12,
          "column": 8
        },
        "end": {
          "line": 14,
          "column": 30
        }
      },
      "4": {
        "start": {
          "line": 12,
          "column": 33
        },
        "end": {
          "line": 12,
          "column": 50
        }
      },
      "5": {
        "start": {
          "line": 13,
          "column": 13
        },
        "end": {
          "line": 14,
          "column": 30
        }
      },
      "6": {
        "start": {
          "line": 13,
          "column": 38
        },
        "end": {
          "line": 13,
          "column": 54
        }
      },
      "7": {
        "start": {
          "line": 14,
          "column": 13
        },
        "end": {
          "line": 14,
          "column": 30
        }
      },
      "8": {
        "start": {
          "line": 16,
          "column": 19
        },
        "end": {
          "line": 16,
          "column": 35
        }
      },
      "9": {
        "start": {
          "line": 17,
          "column": 4
        },
        "end": {
          "line": 59,
          "column": 7
        }
      },
      "10": {
        "start": {
          "line": 32,
          "column": 28
        },
        "end": {
          "line": 32,
          "column": 48
        }
      },
      "11": {
        "start": {
          "line": 42,
          "column": 47
        },
        "end": {
          "line": 42,
          "column": 131
        }
      }
    },
    "fnMap": {
      "0": {
        "name": "(anonymous_0)",
        "decl": {
          "start": {
            "line": 7,
            "column": 49
          },
          "end": {
            "line": 7,
            "column": 50
          }
        },
        "loc": {
          "start": {
            "line": 7,
            "column": 58
          },
          "end": {
            "line": 60,
            "column": 1
          }
        },
        "line": 7
      },
      "1": {
        "name": "(anonymous_1)",
        "decl": {
          "start": {
            "line": 11,
            "column": 27
          },
          "end": {
            "line": 11,
            "column": 28
          }
        },
        "loc": {
          "start": {
            "line": 11,
            "column": 31
          },
          "end": {
            "line": 15,
            "column": 5
          }
        },
        "line": 11
      },
      "2": {
        "name": "(anonymous_2)",
        "decl": {
          "start": {
            "line": 32,
            "column": 22
          },
          "end": {
            "line": 32,
            "column": 23
          }
        },
        "loc": {
          "start": {
            "line": 32,
            "column": 28
          },
          "end": {
            "line": 32,
            "column": 48
          }
        },
        "line": 32
      },
      "3": {
        "name": "(anonymous_3)",
        "decl": {
          "start": {
            "line": 42,
            "column": 43
          },
          "end": {
            "line": 42,
            "column": 44
          }
        },
        "loc": {
          "start": {
            "line": 42,
            "column": 47
          },
          "end": {
            "line": 42,
            "column": 131
          }
        },
        "line": 42
      }
    },
    "branchMap": {
      "0": {
        "loc": {
          "start": {
            "line": 12,
            "column": 8
          },
          "end": {
            "line": 14,
            "column": 30
          }
        },
        "type": "if",
        "locations": [
          {
            "start": {
              "line": 12,
              "column": 8
            },
            "end": {
              "line": 14,
              "column": 30
            }
          },
          {
            "start": {
              "line": 13,
              "column": 13
            },
            "end": {
              "line": 14,
              "column": 30
            }
          }
        ],
        "line": 12
      },
      "1": {
        "loc": {
          "start": {
            "line": 13,
            "column": 13
          },
          "end": {
            "line": 14,
            "column": 30
          }
        },
        "type": "if",
        "locations": [
          {
            "start": {
              "line": 13,
              "column": 13
            },
            "end": {
              "line": 14,
              "column": 30
            }
          },
          {
            "start": {
              "line": 14,
              "column": 13
            },
            "end": {
              "line": 14,
              "column": 30
            }
          }
        ],
        "line": 13
      },
      "2": {
        "loc": {
          "start": {
            "line": 32,
            "column": 28
          },
          "end": {
            "line": 32,
            "column": 48
          }
        },
        "type": "cond-expr",
        "locations": [
          {
            "start": {
              "line": 32,
              "column": 38
            },
            "end": {
              "line": 32,
              "column": 41
            }
          },
          {
            "start": {
              "line": 32,
              "column": 44
            },
            "end": {
              "line": 32,
              "column": 48
            }
          }
        ],
        "line": 32
      }
    },
    "s": {
      "0": 6,
      "1": 25,
      "2": 25,
      "3": 25,
      "4": 5,
      "5": 20,
      "6": 2,
      "7": 18,
      "8": 25,
      "9": 25,
      "10": 25,
      "11": 5
    },
    "f": {
      "0": 25,
      "1": 25,
      "2": 25,
      "3": 5
    },
    "b": {
      "0": [
        5,
        20
      ],
      "1": [
        2,
        18
      ],
      "2": [
        20,
        5
      ]
    },
    "inputSourceMap": {
      "version": 3,
      "sources": [
        "src/components/example/example.tsx"
      ],
      "sourceRoot": "",
      "names": [],
      "mappings": ";;;;;;iDAEsC,CAAC;IACrC,MAAM,QAAQ,SAAS;QACrB,SAAS;IACX;IAEA,MAAM,iBAAiB;QACrB,IAAI,MAAM,OAAO,KAAK,GACpB,OAAO;aACF,IAAI,MAAM,OAAO,KAAK,GAC3B,OAAO;aAEP,OAAO;IAEX;IAEA,MAAM,SAAS;IAEf,qBACE;sBACE,WAAC;YAAK;sBACG;YAAc;YAAE;;;;;;sBAEzB,WAAC;YAAI,OAAM;;YAAO;4BAAO,GAAM,IAAI,GAAG,MAAM;;;;;;;;sBAC5C,WAAC;YAAO,OAAM;YAAc,QAAQ;;;;;;;;WAAyB;;;;;;;;;;AAKnE"
    },
    "_coverageSchema": "1a1c01bbd47fc00a2c39e90264f33305004495a9",
    "hash": "c07536cfa8e72df4e6409c29e9fdabb60c4c94ae"
  },
  "/Users/maieul/dev/playgrounds/qwik-coverage-repro/src/components/example/example.tsx_ExampleTest_component_Fragment_button_onClick_5dWdEYGDp1Q.js": {
    "path": "/Users/maieul/dev/playgrounds/qwik-coverage-repro/src/components/example/example.tsx_ExampleTest_component_Fragment_button_onClick_5dWdEYGDp1Q.js",
    "statementMap": {
      "0": {
        "start": {
          "line": 2,
          "column": 73
        },
        "end": {
          "line": 5,
          "column": 1
        }
      },
      "1": {
        "start": {
          "line": 3,
          "column": 20
        },
        "end": {
          "line": 3,
          "column": 37
        }
      },
      "2": {
        "start": {
          "line": 4,
          "column": 4
        },
        "end": {
          "line": 4,
          "column": 27
        }
      }
    },
    "fnMap": {
      "0": {
        "name": "(anonymous_0)",
        "decl": {
          "start": {
            "line": 2,
            "column": 73
          },
          "end": {
            "line": 2,
            "column": 74
          }
        },
        "loc": {
          "start": {
            "line": 2,
            "column": 77
          },
          "end": {
            "line": 5,
            "column": 1
          }
        },
        "line": 2
      }
    },
    "branchMap": {},
    "s": {
      "0": 3,
      "1": 9,
      "2": 9
    },
    "f": {
      "0": 9
    },
    "b": {},
    "inputSourceMap": {
      "version": 3,
      "sources": [
        "src/components/example/example.tsx"
      ],
      "sourceRoot": "",
      "names": [],
      "mappings": ";yEAyB4C;;WAAM,MAAM,OAAO"
    },
    "_coverageSchema": "1a1c01bbd47fc00a2c39e90264f33305004495a9",
    "hash": "9b24b9fd9bca72b8c18b94f9df735ea316dd628d"
  }
}
  • Do you have any custom NYC settings in package.json (nyc object) or in other NYC config files?
{
    "cwd": "./",
    "extends": "@istanbuljs/nyc-config-typescript",
    "check-coverage": true,
    "include": ["src/**/*.ts", "src/**/*.tsx"],
    "exclude": ["cypress/**/*.*", "**/*.d.ts", "**/*.cy.tsx", "**/*.cy.ts"]
}
  • Do you run Cypress tests in a Docker container?
    🙅‍♂️

Describe the bug

Trying to setup code coverage with Qwik + Vite + cypress component testing, I found that @cypress/code-coverage cannot handle files such as src/components/example/example.tsx_ExampleTest_component_2RuRrW0S9gQ.js which are used heavily in development with Qwik.
image

So when @cypress/code-coverage processes the nyc output with this file path, it creates a report that seems to know about the coverage information, but is unable to locate the original file because the constructed path is wrong.
image

Looking further down into the rabbit hole with the help of a fork and some console logging, it seems the problem comes down to the way fixSourcePaths returns the absolutePath if the source includes the fileName, otherwise returns the source. So when the source === "src/components/example/example.tsx", and the fileName === "example.tsx_ExampleTest_component_Fragment_button_onClick_5dWdEYGDp1Q.js", it returns the source as is, which is a relative path that can't be handled by the coverage report.

But when we look at the sourceRoot and the source itself, it seems this is all the information we need to reconstruct the absolut path needed for the coverage report.

Link to the repo
The repro contains the steps to reproduce the issue, as well as the steps to see how it behaves with a potential fix: https://github.com/maiieul/qwik-cypress-coverage-repro/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant