Skip to content

Commit ddad258

Browse files
authored
Fix asset URLs (#52)
1 parent 5a494e4 commit ddad258

File tree

6 files changed

+177
-83
lines changed

6 files changed

+177
-83
lines changed

CHANGELOG.md

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,16 @@ See [GitHub releases](https://github.com/mll-lab/laravel-graphiql/releases).
99

1010
## Unreleased
1111

12+
## v3.3.2
13+
14+
### Fixed
15+
16+
- Add `https:` to the CDN URLs
17+
18+
### Deprecated
19+
20+
- Deprecated asset methods in `DownloadAssetsCommand` in favor of `GraphiQLAsset` class
21+
1222
## v3.3.1
1323

1424
### Fixed

UPGRADE.md

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,50 @@
22

33
This document provides guidance for upgrading between major versions.
44

5+
## v3 to v4
6+
7+
### View
8+
9+
The URLs for the GraphiQL assets are now provided by class `MLL\GraphiQL\GraphiQLAsset` instead of `MLL\GraphiQL\DownloadAssetsCommand`.
10+
If you have published the view, update it according to this diff:
11+
12+
```diff
13+
@@ -1,6 +1,8 @@
14+
<!DOCTYPE html>
15+
<html lang="en">
16+
-@php use MLL\GraphiQL\DownloadAssetsCommand; @endphp
17+
+@php
18+
+use MLL\GraphiQL\GraphiQLAsset;
19+
+@endphp
20+
<head>
21+
<meta charset=utf-8/>
22+
<meta name="viewport"
23+
@@ -45,17 +47,17 @@
24+
margin-left: var(--px-12);
25+
}
26+
</style>
27+
- <script src="{{ DownloadAssetsCommand::reactPath() }}"></script>
28+
- <script src="{{ DownloadAssetsCommand::reactDOMPath() }}"></script>
29+
- <link rel="stylesheet" href="{{ DownloadAssetsCommand::cssPath() }}"/>
30+
- <link rel="shortcut icon" href="{{ DownloadAssetsCommand::faviconPath() }}"/>
31+
+ <script src="{{ GraphiQLAsset::reactJS() }}"></script>
32+
+ <script src="{{ GraphiQLAsset::reactDOMJS() }}"></script>
33+
+ <link rel="stylesheet" href="{{ GraphiQLAsset::graphiQLCSS() }}"/>
34+
+ <link rel="shortcut icon" href="{{ GraphiQLAsset::favicon() }}"/>
35+
</head>
36+
37+
<body>
38+
39+
<div id="graphiql">Loading...</div>
40+
-<script src="{{ DownloadAssetsCommand::jsPath() }}"></script>
41+
-<script src="{{ DownloadAssetsCommand::pluginExplorerPath() }}"></script>
42+
+<script src="{{ GraphiQLAsset::graphiQLJS() }}"></script>
43+
+<script src="{{ GraphiQLAsset::pluginExplorerJS() }}"></script>
44+
<script>
45+
const fetcher = GraphiQL.createFetcher({
46+
url: '{{ $url }}',
47+
```
48+
549
## v1 to v2
650

751
### Multiple routes

src/DownloadAssetsCommand.php

Lines changed: 20 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -3,57 +3,34 @@
33
namespace MLL\GraphiQL;
44

55
use Illuminate\Console\Command;
6-
use Illuminate\Container\Container;
7-
use Illuminate\Contracts\Routing\UrlGenerator;
8-
use Illuminate\Foundation\Application as LaravelApplication;
9-
use Laravel\Lumen\Application as LumenApplication;
106

117
class DownloadAssetsCommand extends Command
128
{
13-
public const REACT_PATH_LOCAL = 'vendor/graphiql/react.production.min.js';
14-
public const REACT_PATH_CDN = '//cdn.jsdelivr.net/npm/react@17/umd/react.production.min.js';
15-
16-
public const REACT_DOM_PATH_LOCAL = 'vendor/graphiql/react-dom.production.min.js';
17-
public const REACT_DOM_PATH_CDN = '//cdn.jsdelivr.net/npm/react-dom@17/umd/react-dom.production.min.js';
18-
19-
public const JS_PATH_LOCAL = 'vendor/graphiql/graphiql.min.js';
20-
public const JS_PATH_CDN = '//cdn.jsdelivr.net/npm/graphiql/graphiql.min.js';
21-
22-
public const PLUGIN_EXPLORER_PATH_LOCAL = 'vendor/graphiql/graphiql-plugin-explorer.umd.js';
23-
/** Pinned because the latest version broke, see https://github.com/mll-lab/laravel-graphiql/issues/25. */
24-
public const PLUGIN_EXPLORER_PATH_CDN = '//cdn.jsdelivr.net/npm/@graphiql/[email protected]/dist/index.umd.js';
25-
26-
public const CSS_PATH_LOCAL = 'vendor/graphiql/graphiql.min.css';
27-
public const CSS_PATH_CDN = '//cdn.jsdelivr.net/npm/graphiql/graphiql.min.css';
28-
29-
public const FAVICON_PATH_LOCAL = 'vendor/graphiql/favicon.ico';
30-
public const FAVICON_PATH_CDN = '//raw.githubusercontent.com/graphql/graphql.github.io/source/public/favicon.ico';
31-
329
protected $signature = 'graphiql:download-assets';
3310

3411
protected $description = 'Download the newest version of the GraphiQL assets to serve them locally.';
3512

3613
public function handle(): void
3714
{
38-
$this->downloadFileFromCDN(self::REACT_PATH_LOCAL, self::REACT_PATH_CDN);
39-
$this->downloadFileFromCDN(self::REACT_DOM_PATH_LOCAL, self::REACT_DOM_PATH_CDN);
40-
$this->downloadFileFromCDN(self::CSS_PATH_LOCAL, self::CSS_PATH_CDN);
41-
$this->downloadFileFromCDN(self::JS_PATH_LOCAL, self::JS_PATH_CDN);
42-
$this->downloadFileFromCDN(self::PLUGIN_EXPLORER_PATH_LOCAL, self::PLUGIN_EXPLORER_PATH_CDN);
43-
$this->downloadFileFromCDN(self::FAVICON_PATH_LOCAL, self::FAVICON_PATH_CDN);
15+
$this->downloadFileFromCDN(GraphiQLAsset::REACT_JS_LOCAL_PATH, GraphiQLAsset::REACT_JS_SOURCE_URL);
16+
$this->downloadFileFromCDN(GraphiQLAsset::REACT_DOM_JS_LOCAL_PATH, GraphiQLAsset::REACT_DOM_JS_SOURCE_URL);
17+
$this->downloadFileFromCDN(GraphiQLAsset::GRAPHIQL_CSS_LOCAL_PATH, GraphiQLAsset::GRAPHIQL_CSS_SOURCE_URL);
18+
$this->downloadFileFromCDN(GraphiQLAsset::GRAPHIQL_JS_LOCAL_PATH, GraphiQLAsset::GRAPHIQL_JS_SOURCE_URL);
19+
$this->downloadFileFromCDN(GraphiQLAsset::PLUGIN_EXPLORER_JS_LOCAL_PATH, GraphiQLAsset::PLUGIN_EXPLORER_JS_SOURCE_URL);
20+
$this->downloadFileFromCDN(GraphiQLAsset::FAVICON_LOCAL_PATH, GraphiQLAsset::FAVICON_SOURCE_URL);
4421
}
4522

4623
protected function downloadFileFromCDN(string $localPath, string $cdnPath): void
4724
{
48-
$publicPath = self::publicPath($localPath);
25+
$publicPath = GraphiQLAsset::publicPath($localPath);
4926

5027
// Ensure the directory exists
5128
$directory = dirname($publicPath);
5229
if (! is_dir($directory)) {
5330
mkdir($directory, 0777, true);
5431
}
5532

56-
$contents = file_get_contents("https:{$cdnPath}");
33+
$contents = file_get_contents($cdnPath);
5734
if ($contents === false) {
5835
$error = error_get_last();
5936
throw new \ErrorException($error['message'] ?? 'An error occurred', 0, $error['type'] ?? 1);
@@ -62,60 +39,39 @@ protected function downloadFileFromCDN(string $localPath, string $cdnPath): void
6239
file_put_contents($publicPath, $contents);
6340
}
6441

42+
/** @deprecated use GraphiQLAsset::reactJS, this alias will be removed in the next major version */
6543
public static function reactPath(): string
6644
{
67-
return self::availablePath(self::REACT_PATH_LOCAL, self::REACT_PATH_CDN);
45+
return GraphiQLAsset::reactJS();
6846
}
6947

48+
/** @deprecated use GraphiQLAsset::reactDOMJS, this alias will be removed in the next major version */
7049
public static function reactDOMPath(): string
7150
{
72-
return self::availablePath(self::REACT_DOM_PATH_LOCAL, self::REACT_DOM_PATH_CDN);
51+
return GraphiQLAsset::reactDOMJS();
7352
}
7453

54+
/** @deprecated use GraphiQLAsset::graphiQLJS, this alias will be removed in the next major version */
7555
public static function jsPath(): string
7656
{
77-
return self::availablePath(self::JS_PATH_LOCAL, self::JS_PATH_CDN);
57+
return GraphiQLAsset::graphiQLJS();
7858
}
7959

60+
/** @deprecated use GraphiQLAsset::pluginExplorerJS, this alias will be removed in the next major version */
8061
public static function pluginExplorerPath(): string
8162
{
82-
return self::availablePath(self::PLUGIN_EXPLORER_PATH_LOCAL, self::PLUGIN_EXPLORER_PATH_CDN);
63+
return GraphiQLAsset::pluginExplorerJS();
8364
}
8465

66+
/** @deprecated use GraphiQLAsset::graphiQLCSS, this alias will be removed in the next major version */
8567
public static function cssPath(): string
8668
{
87-
return self::availablePath(self::CSS_PATH_LOCAL, self::CSS_PATH_CDN);
69+
return GraphiQLAsset::graphiQLCSS();
8870
}
8971

72+
/** @deprecated use GraphiQLAsset::favicon, this alias will be removed in the next major version */
9073
public static function faviconPath(): string
9174
{
92-
return self::availablePath(self::FAVICON_PATH_LOCAL, self::FAVICON_PATH_CDN);
93-
}
94-
95-
public static function availablePath(string $local, string $cdn): string
96-
{
97-
return file_exists(self::publicPath($local))
98-
? self::localAssetURL($local)
99-
: self::cdnURL($cdn);
100-
}
101-
102-
public static function publicPath(string $path): string
103-
{
104-
$container = Container::getInstance();
105-
assert($container instanceof LaravelApplication || $container instanceof LumenApplication);
106-
107-
return $container->basePath("public/{$path}");
108-
}
109-
110-
public static function localAssetURL(string $path): string
111-
{
112-
$url = Container::getInstance()->make(UrlGenerator::class);
113-
114-
return $url->asset($path);
115-
}
116-
117-
public static function cdnURL(string $path): string
118-
{
119-
return str_replace('//', '/', $path);
75+
return GraphiQLAsset::favicon();
12076
}
12177
}

src/GraphiQLAsset.php

Lines changed: 82 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
<?php declare(strict_types=1);
2+
3+
namespace MLL\GraphiQL;
4+
5+
use Illuminate\Container\Container;
6+
use Illuminate\Contracts\Routing\UrlGenerator;
7+
use Illuminate\Foundation\Application as LaravelApplication;
8+
use Laravel\Lumen\Application as LumenApplication;
9+
10+
class GraphiQLAsset
11+
{
12+
public const REACT_JS_LOCAL_PATH = 'vendor/graphiql/react.production.min.js';
13+
public const REACT_JS_SOURCE_URL = 'https://cdn.jsdelivr.net/npm/react@17/umd/react.production.min.js';
14+
15+
public const REACT_DOM_JS_LOCAL_PATH = 'vendor/graphiql/react-dom.production.min.js';
16+
public const REACT_DOM_JS_SOURCE_URL = 'https://cdn.jsdelivr.net/npm/react-dom@17/umd/react-dom.production.min.js';
17+
18+
public const GRAPHIQL_CSS_LOCAL_PATH = 'vendor/graphiql/graphiql.min.css';
19+
public const GRAPHIQL_CSS_SOURCE_URL = 'https://cdn.jsdelivr.net/npm/graphiql/graphiql.min.css';
20+
21+
public const FAVICON_LOCAL_PATH = 'vendor/graphiql/favicon.ico';
22+
public const FAVICON_SOURCE_URL = 'https://raw.githubusercontent.com/graphql/graphql.github.io/source/public/favicon.ico';
23+
24+
public const GRAPHIQL_JS_LOCAL_PATH = 'vendor/graphiql/graphiql.min.js';
25+
public const GRAPHIQL_JS_SOURCE_URL = 'https://cdn.jsdelivr.net/npm/graphiql/graphiql.min.js';
26+
27+
public const PLUGIN_EXPLORER_JS_LOCAL_PATH = 'vendor/graphiql/graphiql-plugin-explorer.umd.js';
28+
/** Pinned because the latest version broke, see https://github.com/mll-lab/laravel-graphiql/issues/25. */
29+
public const PLUGIN_EXPLORER_JS_SOURCE_URL = 'https://cdn.jsdelivr.net/npm/@graphiql/[email protected]/dist/index.umd.js';
30+
31+
public static function reactJS(): string
32+
{
33+
return self::availableURL(self::REACT_JS_LOCAL_PATH, self::REACT_JS_SOURCE_URL);
34+
}
35+
36+
public static function reactDOMJS(): string
37+
{
38+
return self::availableURL(self::REACT_DOM_JS_LOCAL_PATH, self::REACT_DOM_JS_SOURCE_URL);
39+
}
40+
41+
public static function graphiQLCSS(): string
42+
{
43+
return self::availableURL(self::GRAPHIQL_CSS_LOCAL_PATH, self::GRAPHIQL_CSS_SOURCE_URL);
44+
}
45+
46+
public static function favicon(): string
47+
{
48+
return self::availableURL(self::FAVICON_LOCAL_PATH, self::FAVICON_SOURCE_URL);
49+
}
50+
51+
public static function graphiQLJS(): string
52+
{
53+
return self::availableURL(self::GRAPHIQL_JS_LOCAL_PATH, self::GRAPHIQL_JS_SOURCE_URL);
54+
}
55+
56+
public static function pluginExplorerJS(): string
57+
{
58+
return self::availableURL(self::PLUGIN_EXPLORER_JS_LOCAL_PATH, self::PLUGIN_EXPLORER_JS_SOURCE_URL);
59+
}
60+
61+
public static function publicPath(string $path): string
62+
{
63+
$container = Container::getInstance();
64+
assert($container instanceof LaravelApplication || $container instanceof LumenApplication);
65+
66+
return $container->basePath("public/{$path}");
67+
}
68+
69+
public static function localURL(string $path): string
70+
{
71+
$url = Container::getInstance()->make(UrlGenerator::class);
72+
73+
return $url->asset($path);
74+
}
75+
76+
public static function availableURL(string $local, string $cdn): string
77+
{
78+
return file_exists(self::publicPath($local))
79+
? self::localURL($local)
80+
: $cdn;
81+
}
82+
}

tests/DownloadAssetsCommandTest.php

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
namespace MLL\GraphiQL\Tests;
44

5-
use MLL\GraphiQL\DownloadAssetsCommand;
5+
use MLL\GraphiQL\GraphiQLAsset;
66

77
final class DownloadAssetsCommandTest extends TestCase
88
{
@@ -11,7 +11,7 @@ protected function setUp(): void
1111
parent::setUp();
1212

1313
foreach (self::paths() as [$localPath, $cdnPath]) {
14-
$publicPath = DownloadAssetsCommand::publicPath($localPath);
14+
$publicPath = GraphiQLAsset::publicPath($localPath);
1515
if (file_exists($publicPath)) {
1616
unlink($publicPath);
1717
}
@@ -21,27 +21,27 @@ protected function setUp(): void
2121
public function testSuccessfulDownload(): void
2222
{
2323
foreach (self::paths() as [$localPath, $cdnPath]) {
24-
$this->assertFileDoesNotExist(DownloadAssetsCommand::publicPath($localPath));
25-
$this->assertSame(DownloadAssetsCommand::cdnURL($cdnPath), DownloadAssetsCommand::availablePath($localPath, $cdnPath));
24+
$this->assertFileDoesNotExist(GraphiQLAsset::publicPath($localPath));
25+
$this->assertSame($cdnPath, GraphiQLAsset::availableURL($localPath, $cdnPath));
2626
}
2727

2828
$this->artisan('graphiql:download-assets')
2929
->assertOk();
3030

3131
foreach (self::paths() as [$localPath, $cdnPath]) {
32-
$this->assertFileExists(DownloadAssetsCommand::publicPath($localPath));
33-
$this->assertSame(DownloadAssetsCommand::localAssetURL($localPath), DownloadAssetsCommand::availablePath($localPath, $cdnPath));
32+
$this->assertFileExists(GraphiQLAsset::publicPath($localPath));
33+
$this->assertSame(GraphiQLAsset::localURL($localPath), GraphiQLAsset::availableURL($localPath, $cdnPath));
3434
}
3535
}
3636

3737
/** @return iterable<array{string, string}> */
3838
private static function paths(): iterable
3939
{
40-
yield [DownloadAssetsCommand::REACT_PATH_LOCAL, DownloadAssetsCommand::REACT_PATH_CDN];
41-
yield [DownloadAssetsCommand::REACT_DOM_PATH_LOCAL, DownloadAssetsCommand::REACT_DOM_PATH_CDN];
42-
yield [DownloadAssetsCommand::JS_PATH_LOCAL, DownloadAssetsCommand::JS_PATH_CDN];
43-
yield [DownloadAssetsCommand::PLUGIN_EXPLORER_PATH_LOCAL, DownloadAssetsCommand::PLUGIN_EXPLORER_PATH_CDN];
44-
yield [DownloadAssetsCommand::CSS_PATH_LOCAL, DownloadAssetsCommand::CSS_PATH_CDN];
45-
yield [DownloadAssetsCommand::FAVICON_PATH_LOCAL, DownloadAssetsCommand::FAVICON_PATH_CDN];
40+
yield [GraphiQLAsset::REACT_JS_LOCAL_PATH, GraphiQLAsset::REACT_JS_SOURCE_URL];
41+
yield [GraphiQLAsset::REACT_DOM_JS_LOCAL_PATH, GraphiQLAsset::REACT_DOM_JS_SOURCE_URL];
42+
yield [GraphiQLAsset::GRAPHIQL_CSS_LOCAL_PATH, GraphiQLAsset::GRAPHIQL_CSS_SOURCE_URL];
43+
yield [GraphiQLAsset::FAVICON_LOCAL_PATH, GraphiQLAsset::FAVICON_SOURCE_URL];
44+
yield [GraphiQLAsset::GRAPHIQL_JS_LOCAL_PATH, GraphiQLAsset::GRAPHIQL_JS_SOURCE_URL];
45+
yield [GraphiQLAsset::PLUGIN_EXPLORER_JS_LOCAL_PATH, GraphiQLAsset::PLUGIN_EXPLORER_JS_SOURCE_URL];
4646
}
4747
}

views/index.blade.php

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
@php use MLL\GraphiQL\DownloadAssetsCommand; @endphp
3+
@php
4+
use MLL\GraphiQL\GraphiQLAsset;
5+
@endphp
46
<head>
57
<meta charset=utf-8/>
68
<meta name="viewport"
@@ -45,17 +47,17 @@
4547
margin-left: var(--px-12);
4648
}
4749
</style>
48-
<script src="{{ DownloadAssetsCommand::reactPath() }}"></script>
49-
<script src="{{ DownloadAssetsCommand::reactDOMPath() }}"></script>
50-
<link rel="stylesheet" href="{{ DownloadAssetsCommand::cssPath() }}"/>
51-
<link rel="shortcut icon" href="{{ DownloadAssetsCommand::faviconPath() }}"/>
50+
<script src="{{ GraphiQLAsset::reactJS() }}"></script>
51+
<script src="{{ GraphiQLAsset::reactDOMJS() }}"></script>
52+
<link rel="stylesheet" href="{{ GraphiQLAsset::graphiQLCSS() }}"/>
53+
<link rel="shortcut icon" href="{{ GraphiQLAsset::favicon() }}"/>
5254
</head>
5355

5456
<body>
5557

5658
<div id="graphiql">Loading...</div>
57-
<script src="{{ DownloadAssetsCommand::jsPath() }}"></script>
58-
<script src="{{ DownloadAssetsCommand::pluginExplorerPath() }}"></script>
59+
<script src="{{ GraphiQLAsset::graphiQLJS() }}"></script>
60+
<script src="{{ GraphiQLAsset::pluginExplorerJS() }}"></script>
5961
<script>
6062
const fetcher = GraphiQL.createFetcher({
6163
url: '{{ $url }}',

0 commit comments

Comments
 (0)