Skip to content

Commit

Permalink
Merge branch 'canary' into fix/write-trsconfig-module-resolution
Browse files Browse the repository at this point in the history
  • Loading branch information
balazsorban44 authored Jul 14, 2022
2 parents cebed76 + e06983b commit 62b8306
Show file tree
Hide file tree
Showing 20 changed files with 92 additions and 34 deletions.
48 changes: 48 additions & 0 deletions docs/accessibility.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
---
description: Learn about the built-in accessibility features of Next.js.
---

# Accessibility

The Next.js team is committed to making Next.js accessible to all developers (and their end-users). By adding accessibility features to Next.js by default, we aim to make the Web more inclusive for everyone.

## Route Announcements

When transitioning between pages rendered on the server (e.g. using the `<a href>` tag) screen readers and other assistive technology announce the page title when the page loads so that users understand that the page has changed.

In addition to traditional page navigations, Next.js also supports client-side transitions for improved performance (using `next/link`). To ensure that client-side transitions are also announced to assistive technology, Next.js includes a route announcer by default.

The Next.js route announcer looks for the page name to announce by first inspecting `document.title`, then the `<h1>` element, and finally the URL pathname. For the most accessible user experience, ensure that each page in your application has a unique and descriptive title.

## Linting

Next.js provides an [integrated ESLint experience](/docs/basic-features/eslint.md) out of the box, including custom rules for Next.js. By default, Next.js includes `eslint-plugin-jsx-a11y` to help catch accessibility issues early, including warning on:

- [aria-props](https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/HEAD/docs/rules/aria-props.md?rgh-link-date=2021-06-04T02%3A10%3A36Z)
- [aria-proptypes](https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/HEAD/docs/rules/aria-proptypes.md?rgh-link-date=2021-06-04T02%3A10%3A36Z)
- [aria-unsupported-elements](https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/HEAD/docs/rules/aria-unsupported-elements.md?rgh-link-date=2021-06-04T02%3A10%3A36Z)
- [role-has-required-aria-props](https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/HEAD/docs/rules/role-has-required-aria-props.md?rgh-link-date=2021-06-04T02%3A10%3A36Z)
- [role-supports-aria-props](https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/HEAD/docs/rules/role-supports-aria-props.md?rgh-link-date=2021-06-04T02%3A10%3A36Z)

For example, this plugin helps ensure you add alt text to `img` tags, use correct `aria-*` attributes, use correct `role` attributes, and more.

## Disabling JavaScript

By default, Next.js prerenders pages to static HTML files. This means that JavaScript is not required to view the HTML markup from the server and is instead used to add interactivity on the client side.

If your application requires JavaScript to be disabled, and only HTML to be used, you can remove all JavaScript from your application using an experimental flag:

```js
// next.config.js
export const config = {
unstable_runtimeJS: false,
}
```

## Accessibility Resources

- [WebAIM WCAG checklist](https://webaim.org/standards/wcag/checklist)
- [WCAG 2.1 Guidelines](https://www.w3.org/TR/WCAG21/)
- [The A11y Project](https://www.a11yproject.com/)
- Check [color contrast ratios](https://developer.mozilla.org/en-US/docs/Web/Accessibility/Understanding_WCAG/Perceivable/Color_contrast) between foreground and background elements
- Use [`prefers-reduced-motion`](https://web.dev/prefers-reduced-motion/) when working with animations
4 changes: 4 additions & 0 deletions docs/manifest.json
Original file line number Diff line number Diff line change
Expand Up @@ -172,6 +172,10 @@
"title": "Testing",
"path": "/docs/testing.md"
},
{
"title": "Accessibility",
"path": "/docs/accessibility.md"
},
{
"title": "Guides",
"routes": [
Expand Down
4 changes: 4 additions & 0 deletions docs/upgrading.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,10 @@ description: Learn how to upgrade Next.js.

# Upgrade Guide

## Upgrading to 12.2

If you were using Middleware prior to `12.2`, please see the [upgrade guide](https://nextjs.org/docs/messages/middleware-upgrade-guide) for more information.

## Upgrading from 11 to 12

### Minimum Node.js version
Expand Down
2 changes: 1 addition & 1 deletion lerna.json
Original file line number Diff line number Diff line change
Expand Up @@ -16,5 +16,5 @@
"registry": "https://registry.npmjs.org/"
}
},
"version": "12.2.3-canary.6"
"version": "12.2.3-canary.7"
}
2 changes: 1 addition & 1 deletion packages/create-next-app/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "create-next-app",
"version": "12.2.3-canary.6",
"version": "12.2.3-canary.7",
"keywords": [
"react",
"next",
Expand Down
4 changes: 2 additions & 2 deletions packages/eslint-config-next/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "eslint-config-next",
"version": "12.2.3-canary.6",
"version": "12.2.3-canary.7",
"description": "ESLint configuration used by NextJS.",
"main": "index.js",
"license": "MIT",
Expand All @@ -9,7 +9,7 @@
"directory": "packages/eslint-config-next"
},
"dependencies": {
"@next/eslint-plugin-next": "12.2.3-canary.6",
"@next/eslint-plugin-next": "12.2.3-canary.7",
"@rushstack/eslint-patch": "^1.1.3",
"@typescript-eslint/parser": "^5.21.0",
"eslint-import-resolver-node": "^0.3.6",
Expand Down
2 changes: 1 addition & 1 deletion packages/eslint-plugin-next/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/eslint-plugin-next",
"version": "12.2.3-canary.6",
"version": "12.2.3-canary.7",
"description": "ESLint plugin for NextJS.",
"main": "lib/index.js",
"license": "MIT",
Expand Down
2 changes: 1 addition & 1 deletion packages/next-bundle-analyzer/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/bundle-analyzer",
"version": "12.2.3-canary.6",
"version": "12.2.3-canary.7",
"main": "index.js",
"types": "index.d.ts",
"license": "MIT",
Expand Down
2 changes: 1 addition & 1 deletion packages/next-codemod/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/codemod",
"version": "12.2.3-canary.6",
"version": "12.2.3-canary.7",
"license": "MIT",
"dependencies": {
"chalk": "4.1.0",
Expand Down
2 changes: 1 addition & 1 deletion packages/next-env/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/env",
"version": "12.2.3-canary.6",
"version": "12.2.3-canary.7",
"keywords": [
"react",
"next",
Expand Down
2 changes: 1 addition & 1 deletion packages/next-mdx/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/mdx",
"version": "12.2.3-canary.6",
"version": "12.2.3-canary.7",
"main": "index.js",
"license": "MIT",
"repository": {
Expand Down
2 changes: 1 addition & 1 deletion packages/next-plugin-storybook/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/plugin-storybook",
"version": "12.2.3-canary.6",
"version": "12.2.3-canary.7",
"repository": {
"url": "vercel/next.js",
"directory": "packages/next-plugin-storybook"
Expand Down
2 changes: 1 addition & 1 deletion packages/next-polyfill-module/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/polyfill-module",
"version": "12.2.3-canary.6",
"version": "12.2.3-canary.7",
"description": "A standard library polyfill for ES Modules supporting browsers (Edge 16+, Firefox 60+, Chrome 61+, Safari 10.1+)",
"main": "dist/polyfill-module.js",
"license": "MIT",
Expand Down
2 changes: 1 addition & 1 deletion packages/next-polyfill-nomodule/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/polyfill-nomodule",
"version": "12.2.3-canary.6",
"version": "12.2.3-canary.7",
"description": "A polyfill for non-dead, nomodule browsers.",
"main": "dist/polyfill-nomodule.js",
"license": "MIT",
Expand Down
2 changes: 1 addition & 1 deletion packages/next-swc/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/swc",
"version": "12.2.3-canary.6",
"version": "12.2.3-canary.7",
"private": true,
"scripts": {
"build-native": "napi build --platform -p next-swc-napi --cargo-name next_swc_napi native --features plugin",
Expand Down
12 changes: 7 additions & 5 deletions packages/next/client/components/hooks-client.ts
Original file line number Diff line number Diff line change
Expand Up @@ -16,13 +16,13 @@ export function useSearchParams() {
return useContext(QueryContext)
}

export function useSearchParam(key: string) {
export function useSearchParam(key: string): string | string[] {
const params = useContext(QueryContext)
return params[key]
}

// TODO-APP: Move the other router context over to this one
export function useRouter() {
export function useRouter(): import('../../shared/lib/app-router-context').AppRouterInstance {
return useContext(AppRouterContext)
}

Expand All @@ -31,7 +31,7 @@ export function useRouter() {
// return useContext(ParamsContext)
// }

export function usePathname() {
export function usePathname(): string {
return useContext(PathnameContext)
}

Expand All @@ -42,8 +42,10 @@ export function usePathname() {

export function useSelectedLayoutSegment(
parallelRouteKey: string = 'children'
) {
): string {
const { tree } = useContext(AppTreeContext)

return tree[1][parallelRouteKey][0]
const segment = tree[1][parallelRouteKey][0]

return Array.isArray(segment) ? segment[1] : segment
}
14 changes: 7 additions & 7 deletions packages/next/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "next",
"version": "12.2.3-canary.6",
"version": "12.2.3-canary.7",
"description": "The React Framework",
"main": "./dist/server/next.js",
"license": "MIT",
Expand Down Expand Up @@ -72,7 +72,7 @@
]
},
"dependencies": {
"@next/env": "12.2.3-canary.6",
"@next/env": "12.2.3-canary.7",
"@swc/helpers": "0.4.3",
"caniuse-lite": "^1.0.30001332",
"postcss": "8.4.14",
Expand Down Expand Up @@ -123,11 +123,11 @@
"@hapi/accept": "5.0.2",
"@napi-rs/cli": "2.4.4",
"@napi-rs/triples": "1.1.0",
"@next/polyfill-module": "12.2.3-canary.6",
"@next/polyfill-nomodule": "12.2.3-canary.6",
"@next/react-dev-overlay": "12.2.3-canary.6",
"@next/react-refresh-utils": "12.2.3-canary.6",
"@next/swc": "12.2.3-canary.6",
"@next/polyfill-module": "12.2.3-canary.7",
"@next/polyfill-nomodule": "12.2.3-canary.7",
"@next/react-dev-overlay": "12.2.3-canary.7",
"@next/react-refresh-utils": "12.2.3-canary.7",
"@next/swc": "12.2.3-canary.7",
"@taskr/clear": "1.1.0",
"@taskr/esnext": "1.1.0",
"@taskr/watch": "1.1.0",
Expand Down
2 changes: 1 addition & 1 deletion packages/react-dev-overlay/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/react-dev-overlay",
"version": "12.2.3-canary.6",
"version": "12.2.3-canary.7",
"description": "A development-only overlay for developing React applications.",
"repository": {
"url": "vercel/next.js",
Expand Down
2 changes: 1 addition & 1 deletion packages/react-refresh-utils/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/react-refresh-utils",
"version": "12.2.3-canary.6",
"version": "12.2.3-canary.7",
"description": "An experimental package providing utilities for React Refresh.",
"repository": {
"url": "vercel/next.js",
Expand Down
14 changes: 7 additions & 7 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit 62b8306

Please sign in to comment.