Test failed when changing baseUrl on www
Nobody has claimed this yet.
Assessment
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Newbie friendliness
- 35/100
- Issue type
- Bug
- Clarity
- Mostly clear
- Activity status
- Stale
- Tech stack
- typescript
- Domain
- testing
Research direction
Reproduce the failure with yarn test using the configuration shown in stencil.config.ts and the scripts in src/index.html. Compare how baseUrl is handled during the build and E2E test, using the reported duplicated /webc-modal URL as the starting symptom. Done means the test loads the component at the correct path and passes with the configured base URL.
Written by the indexing model from the issue text.
Description
Stencil version:
@stencil/core@1.7.5
I'm submitting a:
- bug report
- feature request
- support request
Current behavior:
I am creating a Web Components library with Stencil.
npm-scripts related to stencil are not changed from those generated by npm init stencil.
I changed baseUrl. Because we want to deploy WebSite (www) to GitHub Pages.
Then, when the E2E test is executed, the path of the component file is wrong and the test fails.
Expected behavior:
It seems that the interpretation of baseUrl is different between build and test.
Related code:
Here is the actual repository.
https://github.com/kimulaco/webc-modal
// /stencil.config.ts
import { Config } from '@stencil/core'
import { postcss } from '@stencil/postcss'
import autoprefixer from 'autoprefixer'
export const config: Config = {
namespace: 'webc-modal',
outputTargets: [
{
type: 'dist',
esmLoaderPath: '../loader'
},
{
type: 'docs-readme'
},
{
type: 'www',
baseUrl: '/webc-modal',
serviceWorker: null
}
],
plugins: [
postcss({
plugins: [
autoprefixer()
]
})
]
}
// /src/index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>webc-modal</title>
<script type="module" src="/webc-modal/build/webc-modal.esm.js"></script>
<script nomodule src="/webc-modal/build/webc-modal.js"></script>
</head>
<body>
...
</body>
</html>
When yarn start is executed, it reads normally with the following path, so it works normally.
/webc-modal/build/webc-modal.js
However, when yarn test is executed, the following error occurs.
console.error node_modules/@stencil/core/dist/testing/index.js:39876
Failed to load resource: the server responded with a status of 404 (Not Found)
Location: http://localhost:3333/webc-modal/webc-modal/build/webc-modal.esm.js
console.error node_modules/@stencil/core/dist/testing/index.js:39710
requestfailed http://localhost:3333/webc-modal/webc-modal/build/webc-modal.esm.js
console.error node_modules/@stencil/core/dist/testing/index.js:39876
Failed to load resource: the server responded with a status of 404 (Not Found)
Location: http://localhost:3333/webc-modal/webc-modal/build/webc-modal.esm.js
console.error node_modules/@stencil/core/dist/testing/index.js:39710
requestfailed http://localhost:3333/webc-modal/webc-modal/build/webc-modal.esm.js
As you can see from the above error, we are trying to load the next script during the test.
/webc-modal/webc-modal/build/webc-modal.esm.js
However, an error occurs because the directory does not exist.
This error can also be confirmed by CI.
- Dominant language
- TypeScript
- Stars
- 13.1k
- Forks
- 855
- Avg merge
- 4h 7m
- Merged PRs (30d)
- 44
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from stenciljs/core
-
Stencil v5
Difficulty 2/5 1-3 hours Newbie friendliness 68/100
-
Stencil v5
Difficulty 4/5 3-5 days Newbie friendliness 55/100
-
Bug: Validated Stencil v5
Difficulty 4/5 3-5 days Newbie friendliness 48/100
-
Feature: Want this? Upvote it!
Difficulty 5/5 Over a week Newbie friendliness 25/100
-
Feature: Want this? Upvote it!
Difficulty 4/5 3-5 days Newbie friendliness 48/100
Similar issues
-
clawsweeper:fix-shape-clear clawsweeper:queueable-fix clawsweeper:source-repro impact:ux-friction issue-rating: 🦞 diamond lobster no-stale P3
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
-
community first-timers-only good first issue hacktoberfest help wanted low hanging fruit up-for-grabs
Difficulty 1/5 Under an hour Newbie friendliness 76/100
-
code-quality refactoring
Difficulty 2/5 1-3 hours Newbie friendliness 84/100
github/gh-aw-firewall#8816 ·
-
integration:quickjs org:external priority:backlog topic:code-interpreter topic:middleware type:feature
Difficulty 2/5 1-3 hours Newbie friendliness 74/100
langchain-ai/deepagents#6450 ·
-
Difficulty 1/5 Under an hour Newbie friendliness 88/100
vercel/react-tweet#225 ·