Update dependency graphql-playground-html to 1.6.22 [SECURITY] - abandoned

[renovate]

This PR contains the following updates:

Package	Change
graphql-playground-html	1.6.12 -> 1.6.22

GitHub Vulnerability Alerts

CVE-2020-4038

Impact

directly impacted:

• graphql-playground-html@<1.6.22 - all unsanitized user input for renderPlaygroundPage()

all of our consuming packages of graphql-playground-html are impacted:

• graphql-playground-middleware-express@<1.7.16 - unsanitized user input to expressPlayground()
• graphql-playground-middleware-koa@<1.6.15 - unsanitized user input to koaPlayground()
• graphql-playground-middleware-lambda@<1.7.17 - unsanitized user input to lambdaPlayground()
• graphql-playground-middleware-hapi@<1.6.13 - unsanitized user input to hapiPlayground()

as well as any other packages that use these methods with unsanitized user input.

not impacted:

• graphql-playground-electron - uses renderPlaygroundPage() statically for a webpack build for electron bundle, no dynamic user input
• graphql-playground-react - usage of the component directly in a react application does not expose reflected XSS vulnerabilities. only the demo in public/ contains the vulnerability, because it uses an old version of the html pacakge.

Patches

upgrading to the above mentioned versions will solve the issue.

If you're using graphql-playground-html directly, then:

yarn add graphql-playground-html@^1.6.22

or

npm install --save graphql-playground-html@^1.6.22

Then, similar steps need to be taken for each middleware:

• Upgrade Express Middleware
• Upgrade Koa Middleware
• Upgrade Lambda Middleware
• Upgrade Hapi Middleware

Workarounds

Ensure you properly sanitize all user input for options you use for whatever function to initialize GraphQLPlayground:

for example, with graphql-playground-html and express:

const { sanitizeUrl } = require('@​braintree/sanitize-url');

const qs = require('querystringify');

const { renderPlaygroundPage } = require('graphql-playground-html');

module.exports = (req, res, next) => {
	const { endpoint } = qs.parse(req.url)
	res.html(renderPlaygroundPage({endpoint: sanitizeUrl(endpoint) })).status(200)
	next()
}

or, with graphql-playground-express:

const { expressPlayground } = require('graphql-playground-middleware-express');
const { sanitizeUrl } = require('@​braintree/sanitize-url');

const qs = require('querystringify');

const { renderPlaygroundPage } = require('graphql-playground-html');

module.exports = (req, res, next) => {
	const { endpoint } = qs.parse(req.url)
	res.html(expressPlayground({endpoint: sanitizeUrl(endpoint) })).status(200)
	next()
}

References

• OWASP: How to Test for CSS Reflection Attacks
• Original Report from Cure53 (jpg)

Credits

Masato Kinugawa of Cure53

For more information

If you have any questions or comments about this advisory:

• Open an issue in graphql-playground
• Email us at rikki.schulte@gmail.com

---

Configuration

📅 Schedule: Branch creation - "" (UTC), Automerge - At any time (no schedule defined).

🚦 Automerge: Enabled.

♻ Rebasing: Whenever PR is behind base branch, or you tick the rebase/retry checkbox.

🔕 Ignore: Close this PR and you won't be reminded about this update again.

---

• If you want to rebase/retry this PR, check this box

---

This PR has been generated by Mend Renovate. View repository job log here.

[renovate]

Autoclosing Skipped

This PR has been flagged for autoclosing. However, it is being skipped due to the branch being already modified. Please close/delete it manually or report a bug if you think this is in error.