fixes #90 by adding postProcess hook to scoped-css-preprocessor to break cache for associated template files #95
Conversation
…eak cache for associated template files
🦋 Changeset detectedLatest commit: ad1ca49 The changes in this PR will be included in the next version bump. This PR includes changesets to release 2 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
|
||
| const COMPONENT_EXTENSIONS = ['hbs', 'js', 'ts', 'gjs', 'gts']; | ||
| const TEMPLATE_EXTENSIONS = ['hbs', 'gjs', 'gts']; |
There was a problem hiding this comment.
will be using these for gjs/gts support later
| if (templateOriginal !== templateRewrite) { | ||
| // this is an awful hack because we don't know how to invalidate broccoli-persistent-filter cache | ||
| // ideally we'd invalidate the broccoli-peristent-filter cache here | ||
| await writeFile(templateFilePath, templateContents + ' '); |
There was a problem hiding this comment.
I feel sad that I had to revert to using a hack like this, but the cache invalidation was not working as advertised (or I was just doing it wrong). Would love to fix this to actually invalidate the cache correctly, but this will work for now.
| @@ -67,12 +71,57 @@ class ScopedFilter extends Filter { | |||
| return ''; | |||
| } | |||
| } | |||
| async postProcess(results, relativePath) { | |||
| if (relativePath.endsWith('.module.css')) { | |||
There was a problem hiding this comment.
this should probably be a config option, but I think since usage is low, we can skip it
There was a problem hiding this comment.
I'll add a config option to opt in
There was a problem hiding this comment.
Misunderstood, will look at doing that in a later PR since module.css is also considered elsewhere.
However, I do think I'd like to check for CI to skip the whole thing since CI doesn't do a second pass and we'd be doing extra work for nothing.
if (process.env.CI || relativePath.endsWith('.module.css')) {
return results;
}
|
Trying to figure out how to test this specific functionality, it's very dependent upon changing files, which isn't really in the scope of an integration or even acceptance test. Any advice would be welcome! |
| ); | ||
| } else { | ||
| // find all template tags, and extract the contents to compare | ||
| const templates = parseTemplates(templateRaw, ''); |
There was a problem hiding this comment.
parses templates with ember-template-tag, which returns an array of identified template tag objects, with contents representing the template markup. We can then use this for the template change check and if any did, we append a space to the file to kick the cache.
On css changes, the postProcess hook compares the previous template build to the current one using extracted classnames that get stored between builds. If there is a difference, we append a single space to the template file, which breaks the cache for the broccoli-persistent-filter that is processing the templates (ideally we would break the cache through the filter's mechanisms, but was unable to figure it out, so this hack works for now).