fix: syntax errors in JS example sections (v2) #18191

lionralfs · 2022-07-10T20:29:48Z

Summary

Followup PR to #18186

This PR…
-->

Adds a new document
Rewrites (or significantly expands) a document
Fixes a typo, bug, or other error

github-actions · 2022-07-10T20:32:21Z

Preview URLs

Flaws

Note! 32 documents with no flaws that don't need to be listed. 🎉

URL: /en-US/docs/Web/API/WebXR_Device_API/Inputs
Title: Inputs and input sources
on GitHub
Flaw count: 2

macros:
- /en-US/docs/Web/API/HTMLElement/pointerdown_event redirects to /en-US/docs/Web/API/Element/pointerdown_event
- /en-US/docs/Web/API/HTMLElement/pointerup_event redirects to /en-US/docs/Web/API/Element/pointerup_event

URL: /en-US/docs/Web/API/WebXR_Device_API/Bounded_reference_spaces
Title: Using bounded reference spaces
on GitHub
Flaw count: 2

macros:
- /en-US/docs/Web/API/XRReferenceSpace/requestOffsetReferenceSpace does not exist
broken_links:
- Can't resolve /en-US/docs/Web/API/WebXR_Device_API/Gamepads

URL: /en-US/docs/Web/API/USBEndpoint
Title: USBEndpoint
on GitHub
Flaw count: 10

macros:
- /en-US/docs/Web/API/USBEndpoint/USBEndpoint does not exist
- /en-US/docs/Web/API/USBEndpoint/endpointNumber does not exist
- /en-US/docs/Web/API/USBEndpoint/direction does not exist
- /en-US/docs/Web/API/USBEndpoint/type does not exist
- /en-US/docs/Web/API/USBEndpoint/packetSize does not exist
bad_bcd_links:
- no explanation!
- no explanation!
- no explanation!
- no explanation!
- no explanation!

URL: /en-US/docs/Web/API/VRDisplay/submitFrame
Title: VRDisplay.submitFrame()
on GitHub
Flaw count: 1

macros:
- /en-US/docs/Web/API/GetFrameData does not exist

URL: /en-US/docs/Web/API/Web_Speech_API/Using_the_Web_Speech_API
Title: Using the Web Speech API
on GitHub
Flaw count: 1

broken_links:
- Can't resolve /en-US/docs/Web/API/GlobalEventHandlers/onsubmit

URL: /en-US/docs/Web/API/WebGLRenderingContext/getContextAttributes
Title: WebGLRenderingContext.getContextAttributes()
on GitHub
Flaw count: 2

macros:
- wrong xref macro used (consider changing which macro you use)
- wrong xref macro used (consider changing which macro you use)

External URLs

URL: /en-US/docs/Web/API/URL_Pattern_API
Title: URL Pattern API
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/VRPose/angularAcceleration
Title: VRPose.angularAcceleration
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/VRPose/linearAcceleration
Title: VRPose.linearAcceleration
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/VRPose/linearVelocity
Title: VRPose.linearVelocity
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/VRPose/angularVelocity
Title: VRPose.angularVelocity
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/VideoFrame/VideoFrame
Title: VideoFrame()
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/WebXR_Device_API/Performance
Title: WebXR performance guide
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/WebXR_Device_API/Inputs
Title: Inputs and input sources
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/WebXR_Device_API/Startup_and_shutdown
Title: Starting up and shutting down a WebXR session
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/WebXR_Device_API/Bounded_reference_spaces
Title: Using bounded reference spaces
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/USBEndpoint
Title: USBEndpoint
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/WEBGL_multi_draw
Title: WEBGL_multi_draw
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/WEBGL_multi_draw/multiDrawElementsWEBGL
Title: WEBGL_multi_draw.multiDrawElementsWEBGL()
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/WEBGL_multi_draw/multiDrawElementsInstancedWEBGL
Title: WEBGL_multi_draw.multiDrawElementsInstancedWEBGL()
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/WebGLActiveInfo
Title: WebGLActiveInfo
on GitHub

No external URLs

URL: /en-US/docs/Web/API/VRLayerInit
Title: VRLayerInit
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/Web_Serial_API
Title: Web Serial API
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/VRDisplay/getPose
Title: VRDisplay.getPose()
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/VRDisplay/cancelAnimationFrame
Title: VRDisplay.cancelAnimationFrame()
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/VRDisplay/requestAnimationFrame
Title: VRDisplay.requestAnimationFrame()
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/VRDisplay/getFrameData
Title: VRDisplay.getFrameData()
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/VRDisplay/submitFrame
Title: VRDisplay.submitFrame()
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/Web_Speech_API/Using_the_Web_Speech_API
Title: Using the Web Speech API
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/Web_Audio_API/Using_IIR_filters
Title: Using IIR filters
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/VideoTrack
Title: VideoTrack
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/WebGL_API/WebGL_best_practices
Title: WebGL best practices
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/WebGL_API/Tutorial/Lighting_in_WebGL
Title: Lighting in WebGL
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL
Title: Using textures in WebGL
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/WebGL_API/Tutorial/Creating_3D_objects_using_WebGL
Title: Creating 3D objects using WebGL
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/WebGL_API/Tutorial/Using_shaders_to_apply_color_in_WebGL
Title: Using shaders to apply color in WebGL
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/WebGL_API/WebGL_model_view_projection
Title: WebGL model view projection
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/WebGLRenderingContext/getContextAttributes
Title: WebGLRenderingContext.getContextAttributes()
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/WebSockets_API/Writing_WebSocket_servers
Title: Writing WebSocket servers
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/URLPattern/URLPattern
Title: URLPattern()
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/Web_Workers_API/Using_web_workers
Title: Using Web Workers
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/VRFrameData/timestamp
Title: VRFrameData.timestamp
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/User_Timing_API/Using_the_User_Timing_API
Title: Using the User Timing API
on GitHub

No new external URLs

URL: /en-US/docs/Web/API/Web_Animations_API/Using_the_Web_Animations_API
Title: Using the Web Animations API
on GitHub

No new external URLs

(this comment was updated 2022-07-12 19:24:49.721313)

files/en-us/web/api/webxr_device_api/startup_and_shutdown/index.md

Josh-Cena · 2022-07-11T01:36:34Z

files/en-us/web/api/webxr_device_api/performance/index.md

@@ -78,14 +78,14 @@ This renders a scene. But it's inefficient, because it allocates as local variab
 A simple change can optimize this significantly:

 ```js
-const vertexList = ...
+const vertexList = "...";


This is turning "obviously incorrect" code into "less obviously incorrect" code. This entire page seems incomplete—not sure what to do about it.

Suggested change

const vertexList = "...";

const vertexList = [/*...*/];

?

ghost · 2022-07-11T02:12:42Z

files/en-us/web/api/web_speech_api/using_the_web_speech_api/index.md

@@ -68,7 +68,7 @@ const SpeechRecognitionEvent = window.SpeechRecognitionEvent || webkitSpeechReco
 The next part of our code defines the grammar we want our app to recognize. The following variable is defined to hold our grammar:

 ```js
-const colors = [ 'aqua' , 'azure' , 'beige', 'bisque', 'black', 'blue', 'brown', 'chocolate', 'coral' ... ];
+const colors = [ 'aqua' , 'azure' , 'beige', 'bisque', 'black', 'blue', 'brown', 'chocolate', 'coral' /* ... */ ];


As trailing commas are allowed, might this fit better?

Suggested change

const colors = [ 'aqua' , 'azure' , 'beige', 'bisque', 'black', 'blue', 'brown', 'chocolate', 'coral' /* ... */ ];

const colors = [ 'aqua' , 'azure' , 'beige', 'bisque', 'black', 'blue', 'brown', 'chocolate', 'coral', /* ... */ ];

Or (I don't have strong feelings):

Suggested change

const colors = [ 'aqua' , 'azure' , 'beige', 'bisque', 'black', 'blue', 'brown', 'chocolate', 'coral' /* ... */ ];

const colors = [ 'aqua' , 'azure' , 'beige', 'bisque', 'black', 'blue', 'brown', 'chocolate', 'coral' /* , ... */ ];

files/en-us/web/api/webgl_api/webgl_model_view_projection/index.md

teoli2003 · 2022-07-11T05:17:05Z

files/en-us/web/api/webglactiveinfo/index.md

@@ -29,7 +29,7 @@ A `WebGLActiveInfo` object is returned by:
 - {{domxref("WebGLRenderingContext.getActiveUniform()")}} or
 - {{domxref("WebGL2RenderingContext.getTransformFeedbackVarying()")}}

-```js
+```glsl


This sounds like WebIDL: let's remove the whole block, it doesn't bring anything.

teoli2003 · 2022-07-11T05:19:59Z

files/en-us/web/api/webglrenderingcontext/texparameter/index.md

+```glsl
 texParameterf(target, GLenum pname, GLfloat param)
 texParameteri(target, GLenum pname, GLint param)


Suggested change

```glsl

texParameterf(target, GLenum pname, GLfloat param)

texParameteri(target, GLenum pname, GLint param)

```js

texParameterf(target, pname, param)

(It will be a jssyntax in the future, as soon as the PR allowing it in Prism lands.

teoli2003 · 2022-07-11T05:21:02Z

files/en-us/web/api/webxr_device_api/performance/index.md

  for (object in scene) {
-    let vertexList = ...
+    let vertexList = "...";


If it is a list. I think it should be:

Suggested change

let vertexList = "...";

let vertexList = [/* ... */];

teoli2003 · 2022-07-11T05:21:46Z

files/en-us/web/api/webxr_device_api/performance/index.md

@@ -78,14 +78,14 @@ This renders a scene. But it's inefficient, because it allocates as local variab
 A simple change can optimize this significantly:

 ```js
-const vertexList = ...
+const vertexList = "...";


Suggested change

const vertexList = "...";

const vertexList = [/*...*/];

?

files/en-us/web/api/url_pattern_api/index.md

files/en-us/web/api/urlpattern/urlpattern/index.md

files/en-us/web/api/usbendpoint/index.md

lionralfs · 2022-07-11T16:40:39Z

I'll use this comment to document some of the errors/intricacies I've come across but skipped for now:

(POTENTIALLY OUTDATED, SEE #18186 (comment)):

delete()
- see comments from previous PR (fix: syntax errors in JS example sections #18186)
"chunked" code
- The code sections/examples on this page are written in a specific way where a large block of code is intertwined with text paragraphs, obviously syntax-breaking
- This is not the only page where examples are written like this, I'll refer to this style of writing as "chunked" from now on
glsl?
- See comment in this PR
return outside of function
return outside of function
return outside of function
js hidden?
js hidden?
js hidden?
js hidden?
js hidden?
"chunked" code
"code diff"
loose catch blocks all throughout this file
"chunked" code
method without surrounding class
- multiple times in this file
"chunked" code
method without surrounding class
delete(name)

teoli2003 · 2022-07-11T17:03:21Z

* ["chunked" code](https://github.com/mdn/content/blob/0294e8ed09353dda85fadb4d261ee7f8b12eb4d5/files/en-us/web/api/web_audio_api/simple_synth/index.md?plain=1#L225-L337)

I wonder if this won't be a deal-breaker if we want to automate ESLint? What do you think @Josh-Cena. How can we work around this problem?

Josh-Cena · 2022-07-12T01:14:26Z

@teoli2003 It would be an issue, but we can (a) disable the linter on that block (b) split it (c) tell the linter to re-parse at // OR and similar comments. The (c) probably means forking the linter and doing our own magic, but that's not unacceptable (I've done something similar since I've played with Markdown infrastructure quite a lot).

RE: glsl, my stance is we should give the code block a language whenever we can. Prism itself does have glsl highlighting—whether Yari includes that bundle is another problem.

teoli2003 · 2022-07-12T05:16:26Z

If Prism has it, we should add it and update Yari to use it (There is a list of languages it "loads").

Josh-Cena · 2022-07-12T05:19:43Z

For sure. I have yet to see a non-obscure language that Prism doesn't have a component for...

files/en-us/web/api/url_pattern_api/index.md

teoli2003 · 2022-07-12T09:16:18Z

files/en-us/web/api/urlpattern/urlpattern/index.md

+    // same as
+    new URLPattern(
+      '/books/:id',
+      'https://example.com',
+    );
+    // or
+    new URLPattern({
+      protocol: 'https',
+      hostname: 'example.com',
+      pathname: '/books/:id',
+    });
+    // or
+    new URLPattern({
+      pathname: '/books/:id',
+      baseURL: 'https://example.com',
+    });
+```


I would put const pattern =… in front of each case.

Or const pattern1 = and varying the 1.

The first one was already using let pattern = ... so I've adoped let and went with your suggestion of naming the variables pattern[1..4]

files/en-us/web/api/webgl_api/webgl_model_view_projection/index.md

teoli2003 · 2022-07-12T09:51:00Z

So one comment left to address and this is good to go.

teoli2003

👍
Thanks a lot, we learned a lot thanks to this PR.

syntax fixes

66a831e

github-actions bot added the Content:WebAPI Web API docs label Jul 10, 2022

lionralfs commented Jul 10, 2022

View reviewed changes

files/en-us/web/api/webxr_device_api/startup_and_shutdown/index.md Show resolved Hide resolved

Josh-Cena reviewed Jul 11, 2022

View reviewed changes

ghost reviewed Jul 11, 2022

View reviewed changes

teoli2003 reviewed Jul 11, 2022

View reviewed changes

files/en-us/web/api/webgl_api/webgl_model_view_projection/index.md Show resolved Hide resolved

teoli2003 reviewed Jul 11, 2022

View reviewed changes

files/en-us/web/api/webgl_api/webgl_model_view_projection/index.md Show resolved Hide resolved

teoli2003 reviewed Jul 11, 2022

View reviewed changes

lionralfs added 5 commits July 11, 2022 16:48

Merge branch 'main' into fix-js-example-syntax-errors-2

8e448db

use descriptive variable names

29d4d29

incorporate review suggestions

dbabf18

syntax fixes

1c23cfd

Merge branch 'main' into fix-js-example-syntax-errors-2

7ea4684

lionralfs marked this pull request as ready for review July 11, 2022 15:56

lionralfs requested a review from a team as a code owner July 11, 2022 15:56

lionralfs requested review from wbamberg and removed request for a team July 11, 2022 15:56

lionralfs commented Jul 11, 2022

View reviewed changes

files/en-us/web/api/url_pattern_api/index.md Show resolved Hide resolved

lionralfs commented Jul 11, 2022

View reviewed changes

files/en-us/web/api/url_pattern_api/index.md Show resolved Hide resolved

lionralfs commented Jul 11, 2022

View reviewed changes

files/en-us/web/api/urlpattern/urlpattern/index.md Outdated Show resolved Hide resolved

remaining review feedback changes

85df753

lionralfs commented Jul 11, 2022

View reviewed changes

files/en-us/web/api/usbendpoint/index.md Outdated Show resolved Hide resolved

lionralfs added 2 commits July 11, 2022 19:07

incorporate review suggestions

d662590

Merge branch 'main' into fix-js-example-syntax-errors-2

857fd77

teoli2003 suggested changes Jul 12, 2022

View reviewed changes

This comment was marked as spam.

Sign in to view

lionralfs added 3 commits July 12, 2022 19:49

Merge branch 'main' into fix-js-example-syntax-errors-2

81fa858

store patterns in variables pattern[1..4]

268243d

Merge branch 'main' into fix-js-example-syntax-errors-2

7126660

teoli2003 approved these changes Jul 12, 2022

View reviewed changes

teoli2003 merged commit c984759 into mdn:main Jul 12, 2022

lionralfs deleted the fix-js-example-syntax-errors-2 branch July 13, 2022 10:04

This was referenced Jul 13, 2022

fix: syntax errors in JS example sections (v3) #18307

Merged

fix: syntax errors in JS example sections (v4) #18424

Merged

fix: syntax errors in JS example sections (v5) #18442

Merged

fix: syntax errors in JS example sections #18186

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

fix: syntax errors in JS example sections (v2) #18191

fix: syntax errors in JS example sections (v2) #18191

lionralfs commented Jul 10, 2022

github-actions bot commented Jul 10, 2022 •

edited

Loading

Josh-Cena Jul 11, 2022

teoli2003 Jul 11, 2022

ghost Jul 11, 2022

teoli2003 Jul 11, 2022

teoli2003 Jul 11, 2022

teoli2003 Jul 11, 2022

teoli2003 Jul 11, 2022

teoli2003 Jul 11, 2022

lionralfs commented Jul 11, 2022 •

edited

Loading

teoli2003 commented Jul 11, 2022

Josh-Cena commented Jul 12, 2022

teoli2003 commented Jul 12, 2022

Josh-Cena commented Jul 12, 2022

teoli2003 Jul 12, 2022

lionralfs Jul 12, 2022

teoli2003 commented Jul 12, 2022

This comment was marked as spam.

teoli2003 left a comment

	const colors = [ 'aqua' , 'azure' , 'beige', 'bisque', 'black', 'blue', 'brown', 'chocolate', 'coral' /* ... */ ];
	const colors = [ 'aqua' , 'azure' , 'beige', 'bisque', 'black', 'blue', 'brown', 'chocolate', 'coral', /* ... */ ];

fix: syntax errors in JS example sections (v2) #18191

fix: syntax errors in JS example sections (v2) #18191

Conversation

lionralfs commented Jul 10, 2022

Summary

github-actions bot commented Jul 10, 2022 • edited Loading

Preview URLs

Flaws

External URLs

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

lionralfs commented Jul 11, 2022 • edited Loading

teoli2003 commented Jul 11, 2022

Josh-Cena commented Jul 12, 2022

teoli2003 commented Jul 12, 2022

Josh-Cena commented Jul 12, 2022

Choose a reason for hiding this comment

Choose a reason for hiding this comment

teoli2003 commented Jul 12, 2022

This comment was marked as spam.

teoli2003 left a comment

Choose a reason for hiding this comment

github-actions bot commented Jul 10, 2022 •

edited

Loading

lionralfs commented Jul 11, 2022 •

edited

Loading