addURLDependency: use always relative path (#2518)

packages/core/integration-tests/test/css.js

@@ -213,6 +213,54 @@ describe('css', function() {
     );
   });
 
+  it('should support linking to assets in parent folders with url() from CSS', async function() {
+    let b = await bundle(
+      [
+        path.join(__dirname, '/integration/css-url-relative/src/a/style1.css'),
+        path.join(__dirname, '/integration/css-url-relative/src/b/style2.css')
+      ],
+      {
+        production: true,
+        sourceMaps: false
+      }
+    );
+
+    await assertBundleTree(b, [
+      {
+        type: 'css',
+        assets: ['style1.css'],
+        childBundles: [
+          {
+            type: 'png'
+          }
+        ]
+      },
+      {
+        type: 'css',
+        assets: ['style2.css']
+      }
+    ]);
+
+    let css = await fs.readFile(
+      path.join(__dirname, '/dist/a/style1.css'),
+      'utf8'
+    );
+
+    assert(css.includes('background-image'), 'includes `background-image`');
+    assert(/url\([^)]*\)/.test(css), 'includes url()');
+
+    assert(
+      await fs.exists(
+        path.join(
+          __dirname,
+          path.dirname('/dist/a/style1.css'),
+          css.match(/url\(([^)]*)\)/)[1]
+        )
+      ),
+      'path specified in url() exists'
+    );
+  });
+
   it('should support transforming with postcss', async function() {
     let b = await bundle(path.join(__dirname, '/integration/postcss/index.js'));
 

packages/core/integration-tests/test/integration/css-url-relative/src/a/style1.css

@@ -0,0 +1,3 @@
+body {
+    background-image: url('../foo.png');
+}

packages/core/integration-tests/test/integration/css-url-relative/src/b/style2.css

@@ -0,0 +1,3 @@
+body {
+    color: red;
+}

packages/core/parcel-bundler/src/Asset.js

@@ -249,7 +249,8 @@ class Asset {
         // Replace temporary bundle names in the output with the final content-hashed names.
         let newValue = value;
         for (let [name, map] of bundleNameMap) {
-          newValue = newValue.split(name).join(map);
+          let mapRelative = path.relative(path.dirname(this.relativeName), map);
+          newValue = newValue.split(name).join(mapRelative);
         }
 
         // Copy `this.generated` on write so we don't end up writing the final names to the cache.