Merge pull request #17 from whalebone/feature/assets-webpack-plugin

ManifestMapper feature

Author: jiripudil

README.md

@@ -80,7 +80,7 @@ webpack:
 
 You might want to include the Webpack's asset hash in its file name for assets caching (and automatic cache busting in new releases) in the user agent. But how do you reference the asset files in your code if their names are dynamic?
 
-WebpackNetteAdapter comes to the rescue. You can employ the [webpack-manifest-plugin](https://www.npmjs.com/package/webpack-manifest-plugin) or some similar plugin to produce a manifest file, and then configure the adapter to use it:
+WebpackNetteAdapter comes to the rescue. You can employ the [`webpack-manifest-plugin`](https://www.npmjs.com/package/webpack-manifest-plugin) or some similar plugin (see below) to produce a manifest file, and then configure the adapter to use it:
 
 ```yaml
 webpack:
@@ -93,6 +93,20 @@ This way, you can keep using the original asset names, and they get expanded aut
 WebpackNetteAdapter automatically optimizes this in production environment by loading the manifest file in compile time.
 
 
+#### Manifest mappers
+
+By default, WebpackNetteAdapter supports the aforementioned `webpack-manifest-plugin`. If you use a different plugin that produces the manifest in a different format, you can implement and configure a mapper for it. WebpackNetteAdapter comes bundled with a mapper for the [`assets-webpack-plugin`](https://www.npmjs.com/package/assets-webpack-plugin):
+
+```yaml
+webpack:
+    manifest:
+      name: manifest.json
+      mapper: Oops\WebpackNetteAdapter\Manifest\Mapper\AssetsWebpackPluginMapper
+```
+
+You can also implement your own mapper, simply extend `Oops\WebpackNetteAdapter\Manifest\ManifestMapper` and implement its `map()` method. It takes the parsed JSON content of the manifest file and is expected to return a flat array mapping asset names to file names.
+
+
 ### Debugger
 
 In development environment, WebpackNetteAdapter registers its own debug bar panel into Tracy, giving you the overview of

src/DI/WebpackExtension.php

@@ -18,6 +18,7 @@
 use Oops\WebpackNetteAdapter\BuildDirectoryProvider;
 use Oops\WebpackNetteAdapter\Debugging\WebpackPanel;
 use Oops\WebpackNetteAdapter\DevServer;
+use Oops\WebpackNetteAdapter\Manifest\Mapper\WebpackManifestPluginMapper;
 use Oops\WebpackNetteAdapter\Manifest\ManifestLoader;
 use Oops\WebpackNetteAdapter\PublicPathProvider;
 use Tracy;
@@ -49,6 +50,7 @@ class WebpackExtension extends CompilerExtension
 		'manifest' => [
 			'name' => NULL,
 			'optimize' => NULL,
+			'mapper' => WebpackManifestPluginMapper::class,
 		]
 	];
 
@@ -81,7 +83,6 @@ public function loadConfiguration(): void
 			throw new ConfigurationException('You need to specify the dev server URL.');
 		}
 
-
 		$basePathProvider = $builder->addDefinition($this->prefix('pathProvider.basePathProvider'))
 			->setType(BasePathProvider::class)
 			->setFactory(NetteHttpBasePathProvider::class)
@@ -163,7 +164,9 @@ private function setupAssetResolver(array $config): ServiceDefinition
 		if ($config['manifest']['name'] !== NULL) {
 			if ( ! $config['manifest']['optimize']) {
 				$loader = $builder->addDefinition($this->prefix('manifestLoader'))
-					->setFactory(ManifestLoader::class)
+					->setFactory(ManifestLoader::class, [
+						1 => new Statement($config['manifest']['mapper']),
+					])
 					->setAutowired(FALSE);
 
 				$assetResolver->setFactory(AssetNameResolver\ManifestAssetNameResolver::class, [
@@ -176,12 +179,14 @@ private function setupAssetResolver(array $config): ServiceDefinition
 					$config['devServer']['enabled'],
 					$config['devServer']['url'] ?? '',
 					$config['devServer']['publicUrl'] ?? '',
-					$config['devServer']['timeout'] ?? 0.1,
+					$config['devServer']['timeout'],
 					new Client()
 				);
 
+				$mapperInstance = new $config['manifest']['mapper']();
+
 				$directoryProviderInstance = new BuildDirectoryProvider($config['build']['directory'], $devServerInstance);
-				$loaderInstance = new ManifestLoader($directoryProviderInstance);
+				$loaderInstance = new ManifestLoader($directoryProviderInstance, $mapperInstance);
 				$manifestCache = $loaderInstance->loadManifest($config['manifest']['name']);
 
 				$assetResolver->setFactory(AssetNameResolver\StaticAssetNameResolver::class, [$manifestCache]);

src/Manifest/ManifestLoader.php

@@ -19,10 +19,16 @@ class ManifestLoader
 	 */
 	private $directoryProvider;
 
+	/**
+	 * @var ManifestMapper
+	 */
+	private $manifestMapper;
+
 
-	public function __construct(BuildDirectoryProvider $directoryProvider)
+	public function __construct(BuildDirectoryProvider $directoryProvider, ManifestMapper $manifestMapper)
 	{
 		$this->directoryProvider = $directoryProvider;
+		$this->manifestMapper = $manifestMapper;
 	}
 
 
@@ -33,7 +39,7 @@ public function __construct(BuildDirectoryProvider $directoryProvider)
 	public function loadManifest(string $fileName): array
 	{
 		$path = $this->getManifestPath($fileName);
-		$context = \stream_context_create(['ssl' => ['verify_peer' => FALSE]]); // webpack-dev-server uses self-signed certificate
+		$context = \stream_context_create(['ssl' => ['verify_peer' => FALSE, 'verify_peer_name' => FALSE]]); // webpack-dev-server uses self-signed certificate
 		$manifest = @\file_get_contents($path, FALSE, $context); // @ - errors handled by custom exception
 
 		if ($manifest === FALSE) {
@@ -43,7 +49,7 @@ public function loadManifest(string $fileName): array
 			));
 		}
 
-		return Json::decode($manifest, Json::FORCE_ARRAY);
+		return $this->manifestMapper->map(Json::decode($manifest, Json::FORCE_ARRAY));
 	}
 
 

src/Manifest/ManifestMapper.php

@@ -0,0 +1,19 @@
+<?php
+
+declare(strict_types = 1);
+
+namespace Oops\WebpackNetteAdapter\Manifest;
+
+abstract class ManifestMapper
+{
+	final public function __construct()
+	{
+	}
+
+	/**
+	 * Modifies manifest contents
+	 * @param array<mixed> $manifest
+	 * @return array<string, string>
+	 */
+	abstract public function map(array $manifest) : array;
+}

src/Manifest/Mapper/AssetsWebpackPluginMapper.php

@@ -0,0 +1,41 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Oops\WebpackNetteAdapter\Manifest\Mapper;
+
+use Oops\WebpackNetteAdapter\Manifest\ManifestMapper;
+
+
+/**
+ * Maps from https://github.com/ztoben/assets-webpack-plugin format to flat files
+ *
+ * from
+ * {
+ *   "main": {
+ *     "js": "/public/path/to/asset"
+ *   }
+ * }
+ *
+ * to flat used in ManifestAssetNameResolver:
+ * {
+ *  "main.js": "/public/path/to/asset"
+ * }
+ *
+ */
+class AssetsWebpackPluginMapper extends ManifestMapper
+{
+	/**
+	 * @inheritDoc
+	 */
+	public function map(array $manifest): array
+	{
+		$result = [];
+		foreach ($manifest as $main => $parts) {
+			foreach ($parts as $name => $file) {
+				$result[$main . '.' . $name] = $file;
+			}
+		}
+		return $result;
+	}
+}

src/Manifest/Mapper/WebpackManifestPluginMapper.php

@@ -0,0 +1,18 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Oops\WebpackNetteAdapter\Manifest\Mapper;
+
+use Oops\WebpackNetteAdapter\Manifest\ManifestMapper;
+
+/**
+ * Default identity mapper compatible with webpack-manifest-mapper's flat structure.
+ */
+class WebpackManifestPluginMapper extends ManifestMapper
+{
+	public function map(array $manifest): array
+	{
+		return $manifest;
+	}
+}

tests/WebpackNetteAdapter/DI/WebpackExtensionTest.phpt

@@ -89,6 +89,13 @@ class WebpackExtensionTest extends TestCase
 	}
 
 
+	public function testManifestResolverWithMapper(): void
+	{
+		$container = $this->createContainer('manifestWithMapper');
+		Assert::type(ManifestAssetNameResolver::class, $container->getByType(AssetNameResolverInterface::class));
+	}
+
+
 	public function testOptimizedManifest(): void
 	{
 		\putenv('OOPS_WEBPACK_OPTIMIZE_MANIFEST=1');

tests/WebpackNetteAdapter/DI/config/manifestWithMapper.neon

@@ -0,0 +1,13 @@
+extensions:
+	webpack: Oops\WebpackNetteAdapter\DI\WebpackExtension(false)
+
+
+webpack:
+	build:
+		directory: %buildDir%
+		publicPath: dist/
+
+	manifest:
+		name: manifest.json
+		optimize: false
+		mapper: Oops\WebpackNetteAdapter\Manifest\Mapper\AssetsWebpackPluginMapper

tests/WebpackNetteAdapter/Manifest/ManifestLoaderTest.phpt

@@ -7,6 +7,7 @@ namespace OopsTests\WebpackNetteAdapter\Manifest;
 use Oops\WebpackNetteAdapter\BuildDirectoryProvider;
 use Oops\WebpackNetteAdapter\Manifest\CannotLoadManifestException;
 use Oops\WebpackNetteAdapter\Manifest\ManifestLoader;
+use Oops\WebpackNetteAdapter\Manifest\ManifestMapper;
 use Tester\Assert;
 use Tester\TestCase;
 
@@ -24,10 +25,16 @@ class ManifestLoaderTest extends TestCase
 	{
 		$buildDirProvider = \Mockery::mock(BuildDirectoryProvider::class);
 		$buildDirProvider->shouldReceive('getBuildDirectory')->andReturn(__DIR__);
-		$manifestLoader = new ManifestLoader($buildDirProvider);
+
+		$manifestMapper = \Mockery::mock(ManifestMapper::class);
+		$manifestMapper->shouldReceive('map')
+			->with(['asset.js' => 'resolved.asset.js'])
+			->andReturn(['asset.js' => 'mapped.asset.js']);
+
+		$manifestLoader = new ManifestLoader($buildDirProvider, $manifestMapper);
 
 		Assert::same(__DIR__ . '/manifest.json', $manifestLoader->getManifestPath('manifest.json'));
-		Assert::same(['asset.js' => 'resolved.asset.js'], $manifestLoader->loadManifest('manifest.json'));
+		Assert::same(['asset.js' => 'mapped.asset.js'], $manifestLoader->loadManifest('manifest.json'));
 
 		Assert::throws(function () use ($manifestLoader) {
 			$manifestLoader->loadManifest('unknown.js');

tests/WebpackNetteAdapter/Manifest/Mapper/AssetsWebpackPluginMapperTest.phpt

@@ -0,0 +1,39 @@
+<?php
+
+declare(strict_types = 1);
+
+namespace OopsTests\WebpackNetteAdapter\Manifest\Mapper;
+
+use Oops\WebpackNetteAdapter\Manifest\Mapper\AssetsWebpackPluginMapper;
+use Tester\Assert;
+use Tester\TestCase;
+
+
+require_once __DIR__ . '/../../../bootstrap.php';
+
+
+/**
+ * @testCase
+ */
+class AssetsWebpackPluginMapperTest extends TestCase
+{
+
+	public function testMapper(): void
+	{
+		$mapper = new AssetsWebpackPluginMapper();
+
+		$result = $mapper->map([
+			'asset' => [
+				'js' => 'resolved.asset.js',
+			],
+		]);
+
+		Assert::same([
+			'asset.js' => 'resolved.asset.js',
+		], $result);
+	}
+
+}
+
+
+(new AssetsWebpackPluginMapperTest())->run();