diff --git a/docs/src/test-reporters-js.md b/docs/src/test-reporters-js.md
index 0f96666c3e..0285e4e43f 100644
--- a/docs/src/test-reporters-js.md
+++ b/docs/src/test-reporters-js.md
@@ -98,34 +98,6 @@ const config: PlaywrightTestConfig = {
 export default config;
 ```
 
-### Reporter for GitHub Actions
-
-You can use the built in `github` reporter to get automatic failure annotations when running in GitHub actions.
-
-```js js-flavor=js
-// playwright.config.js
-// @ts-check
-
-/** @type {import('@playwright/test').PlaywrightTestConfig} */
-const config = {
-  // 'github' for GitHub Actions CI to generate annotations, default 'list' when running locally
-  reporter: process.env.CI ? 'github' : 'list',
-};
-
-module.exports = config;
-```
-
-```js js-flavor=ts
-// playwright.config.ts
-import { PlaywrightTestConfig } from '@playwright/test';
-
-const config: PlaywrightTestConfig = {
-  // 'github' for GitHub Actions CI to generate annotations, default 'list' when running locally
-  reporter: process.env.CI ? 'github' : 'list',
-};
-export default config;
-```
-
 ## Built-in reporters
 
 All built-in reporters show detailed information about failures, and mostly differ in verbosity for successful runs.
@@ -391,6 +363,38 @@ const config: PlaywrightTestConfig = {
 export default config;
 ```
 
+### GitHub Actions annotations
+
+You can use the built in `github` reporter to get automatic failure annotations when running in GitHub actions. Use it with some other reporter, for example `'dot'` and/or `'json'`.
+
+Note that all other reporters work on GitHub Actions as well, but do not provide annotations.
+
+```js js-flavor=js
+// playwright.config.js
+// @ts-check
+
+/** @type {import('@playwright/test').PlaywrightTestConfig} */
+const config = {
+  // 'github' for GitHub Actions CI to generate annotations, plus a concise 'dot'
+  // default 'list' when running locally
+  reporter: process.env.CI ? [ ['github'], ['dot'] ] : 'list',
+};
+
+module.exports = config;
+```
+
+```js js-flavor=ts
+// playwright.config.ts
+import { PlaywrightTestConfig } from '@playwright/test';
+
+const config: PlaywrightTestConfig = {
+  // 'github' for GitHub Actions CI to generate annotations, plus a concise 'dot'
+  // default 'list' when running locally
+  reporter: process.env.CI ? [ ['github'], ['dot'] ] : 'list',
+};
+export default config;
+```
+
 ## Custom reporters
 
 You can create a custom reporter by implementing a class with some of the reporter methods. Learn more about the [Reporter] API.
diff --git a/packages/playwright-test/src/reporters/github.ts b/packages/playwright-test/src/reporters/github.ts
index bce679531f..ab0d05eb6a 100644
--- a/packages/playwright-test/src/reporters/github.ts
+++ b/packages/playwright-test/src/reporters/github.ts
@@ -16,7 +16,7 @@
 
 import milliseconds from 'ms';
 import path from 'path';
-import { BaseReporter, formatFailure } from './base';
+import { BaseReporter, formatFailure, stripAnsiEscapes } from './base';
 import { TestCase, FullResult } from '../../types/testReporter';
 
 type GitHubLogType = 'debug' | 'notice' | 'warning' | 'error';
@@ -31,13 +31,12 @@ type GitHubLogOptions = Partial<{
 }>;
 
 class GitHubLogger {
-
   private _log(message: string, type: GitHubLogType = 'notice', options: GitHubLogOptions = {}) {
     message = message.replace(/\n/g, '%0A');
     const configs = Object.entries(options)
         .map(([key, option]) => `${key}=${option}`)
         .join(',');
-    console.log(`::${type} ${configs}::${message}`);
+    console.log(stripAnsiEscapes(`::${type} ${configs}::${message}`));
   }
 
   debug(message: string, options?: GitHubLogOptions) {