Skip to content

Template Literals + prepend doesn't work correctly and results in invalid JS build #143

@patocallaghan

Description

@patocallaghan

Take the example code below:

class Application {
  foo() {
    return bar(`${this.path}/application.js`);
  }
}

The particular line of interest is where we have a template literal.

return bar(`${this.path}/application.js`);

When we try to fingerprint this template literal string with some prepend URL it causes invalid JavaScript to be generated in the output.

{
  extensions: ['js', 'json', 'css', 'png', 'jpg', 'gif', 'map'],
  prepend: 'https://static.assets.com/ember/'
}

Expected

return bar(`https://static.assets.com/ember/${this.path}/application.js`);

Actual

return bar(https://static.assets.com/ember/`${this.path}/application.js`);

Notice the backtick to start the prepended string is at the end and not at the start of the fingerprint. This causes the JS to blow up when loaded in a browser.

Reproduction:

PR with failing test

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions