From cf649c2ed918b3cc6bd4c92f38c7752174ac1e9a Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Mon, 24 Aug 2020 11:25:40 +0200 Subject: Inject plugin CSS in embed too --- server/controllers/client.ts | 18 ++++++++++++++---- server/lib/client-html.ts | 21 +++++++++++++++++++++ server/tests/api/server/plugins.ts | 33 ++++++++++++++++++++++++++------- 3 files changed, 61 insertions(+), 11 deletions(-) diff --git a/server/controllers/client.ts b/server/controllers/client.ts index 39a198b59..335a0e082 100644 --- a/server/controllers/client.ts +++ b/server/controllers/client.ts @@ -12,7 +12,6 @@ import { asyncMiddleware, embedCSP } from '../middlewares' const clientsRouter = express.Router() const distPath = join(root(), 'client', 'dist') -const embedPath = join(distPath, 'standalone', 'videos', 'embed.html') const testEmbedPath = join(distPath, 'standalone', 'videos', 'test-embed.html') // Special route that add OpenGraph and oEmbed tags @@ -27,11 +26,16 @@ const embedMiddlewares = [ ? embedCSP : (req: express.Request, res: express.Response, next: express.NextFunction) => next(), - (req: express.Request, res: express.Response) => { + (req: express.Request, res: express.Response, next: express.NextFunction) => { res.removeHeader('X-Frame-Options') + // Don't cache HTML file since it's an index to the immutable JS/CSS files - res.sendFile(embedPath, { maxAge: 0 }) - } + res.setHeader('Cache-Control', 'public, max-age=0') + + next() + }, + + asyncMiddleware(generateEmbedHtmlPage) ] clientsRouter.use('/videos/embed', ...embedMiddlewares) @@ -125,6 +129,12 @@ async function serveIndexHTML (req: express.Request, res: express.Response) { return res.status(404).end() } +async function generateEmbedHtmlPage (req: express.Request, res: express.Response) { + const html = await ClientHtml.getEmbedHTML() + + return sendHTML(html, res) +} + async function generateHTMLPage (req: express.Request, res: express.Response, paramLang?: string) { const html = await ClientHtml.getDefaultHTMLPage(req, res, paramLang) diff --git a/server/lib/client-html.ts b/server/lib/client-html.ts index 6bc48b5df..9f668dedb 100644 --- a/server/lib/client-html.ts +++ b/server/lib/client-html.ts @@ -171,6 +171,23 @@ export class ClientHtml { return this.getAccountOrChannelHTMLPage(() => VideoChannelModel.loadByNameWithHostAndPopulateAccount(nameWithHost), req, res) } + static async getEmbedHTML () { + const path = ClientHtml.getEmbedPath() + console.log('coucu') + console.log(path) + + if (ClientHtml.htmlCache[path]) return ClientHtml.htmlCache[path] + + const buffer = await readFile(path) + + let html = buffer.toString() + html = await ClientHtml.addAsyncPluginCSS(html) + + ClientHtml.htmlCache[path] = html + + return html + } + private static async getAccountOrChannelHTMLPage ( loader: () => Bluebird, req: express.Request, @@ -252,6 +269,10 @@ export class ClientHtml { return join(__dirname, '../../../client/dist/' + buildFileLocale(lang) + '/index.html') } + private static getEmbedPath () { + return join(__dirname, '../../../client/dist/standalone/videos/embed.html') + } + private static addHtmlLang (htmlStringPage: string, paramLang: string) { return htmlStringPage.replace('', ``) } diff --git a/server/tests/api/server/plugins.ts b/server/tests/api/server/plugins.ts index 9885be4e8..ad0a5139b 100644 --- a/server/tests/api/server/plugins.ts +++ b/server/tests/api/server/plugins.ts @@ -28,7 +28,8 @@ import { updatePluginPackageJSON, updatePluginSettings, wait, - waitUntilLog + waitUntilLog, + makeHTMLRequest } from '../../../../shared/extra-utils' import { PluginType } from '../../../../shared/models/plugins/plugin.type' import { PeerTubePluginIndex } from '../../../../shared/models/plugins/peertube-plugin-index.model' @@ -119,9 +120,15 @@ describe('Test plugins', function () { }) it('Should have an empty global css', async function () { - const res = await getPluginsCSS(server.url) + { + const res = await getPluginsCSS(server.url) + expect(res.text).to.be.empty + } - expect(res.text).to.be.empty + for (const path of [ '/', '/videos/embed/1', '/video-playlists/embed/1' ]) { + const res = await makeHTMLRequest(server.url, path) + expect(res.text).to.not.include('link rel="stylesheet" href="/plugins/global.css') + } }) it('Should install a plugin and a theme', async function () { @@ -141,9 +148,15 @@ describe('Test plugins', function () { }) it('Should have the correct global css', async function () { - const res = await getPluginsCSS(server.url) + { + const res = await getPluginsCSS(server.url) + expect(res.text).to.contain('background-color: red') + } - expect(res.text).to.contain('background-color: red') + for (const path of [ '/', '/videos/embed/1', '/video-playlists/embed/1' ]) { + const res = await makeHTMLRequest(server.url, path) + expect(res.text).to.include('link rel="stylesheet" href="/plugins/global.css') + } }) it('Should have the plugin loaded in the configuration', async function () { @@ -388,9 +401,15 @@ describe('Test plugins', function () { }) it('Should have an empty global css', async function () { - const res = await getPluginsCSS(server.url) + { + const res = await getPluginsCSS(server.url) + expect(res.text).to.be.empty + } - expect(res.text).to.be.empty + for (const path of [ '/', '/videos/embed/1', '/video-playlists/embed/1' ]) { + const res = await makeHTMLRequest(server.url, path) + expect(res.text).to.not.include('link rel="stylesheet" href="/plugins/global.css') + } }) it('Should list uninstalled plugins', async function () { -- cgit v1.2.3