Merge remote-tracking branch 'upstream/dev' into working

# Conflicts:
#	docs/en/advanced/lazy-loading.md

Author: MachinisteWeb

docs/en/advanced/lazy-loading.md

@@ -2,23 +2,26 @@
 
 Pendant la construction d'applications avec un empaqueteur (« bundler »), le paquetage JavaScript peut devenir un peu lourd, et donc cela peut affecter le temps de chargement de la page. Il serait plus efficace si l'on pouvait séparer chaque composant de route dans des fragments séparés, et de les charger uniquement lorsque la route est visitée.
 
-En combinant la [fonctionnalité de composant asynchrone](https://fr.vuejs.org/v2/guide/components.html#Composants-asynchrones) de Vue et la [fonctionnalité de séparation de code](https://webpack.js.org/guides/code-splitting-require/) de webpack, il est très facile de charger à la volée les composants de route.
+En combinant la [fonctionnalité de composant asynchrone](https://fr.vuejs.org/v2/guide/components.html#Composants-asynchrones) de Vue et la [fonctionnalité de séparation de code](https://webpack.js.org/guides/code-splitting-async/) de webpack, il est très facile de charger à la volée les composants de route.
 
-Tout ce que nous avons à faire, c'est de définir les composants de notre route en tant que composants asynchrones :
+Premièrement, un composant asynchrone peut définir une fonction fabrique qui retourne une Promesse (qui devrait résoudre le composant lui-même) :
 
 ``` js
-const Foo = resolve => {
-  // `require.ensure` est une syntaxe spéciale de webpack pour une séparation de code.
-  require.ensure(['./Foo.vue'], () => {
-    resolve(require('./Foo.vue'))
-  })
-}
+const Foo = () => Promise.resolve({ /* définition du composant */ })
 ```
 
-Il y a aussi une alternative à la syntaxe de séparation de code utilisant l'inclusion à la sauce AMD, cela peut être simplifié en :
+Deuxièmement, avec webpack 2, nous pouvons utiliser la syntaxe d'[import dynamique](https://github.com/tc39/proposal-dynamic-import) pour indiquer un point de scission de code :
 
 ``` js
-const Foo = resolve => require(['./Foo.vue'], resolve)
+import('./Foo.vue') // returns a Promise
+```
+
+> Note: if you are using Babel, you will need to add the [syntax-dynamic-import](http://babeljs.io/docs/plugins/syntax-dynamic-import/) plugin so that Babel can properly parse the syntax.
+
+Combining the two, this is how to define an async component that will be automatically code-split by webpack:
+
+``` js
+const Foo = () => import('./Foo.vue')
 ```
 
 Rien n'a besoin d'être modifié dans la configuration de la route, utilisez `Foo` comme d'habitude.
@@ -33,12 +36,12 @@ const router = new VueRouter({
 
 ### Grouper des composants dans le même fragment
 
-Parfois on aimerait grouper tous les composants imbriqués sous la même route, dans un seul et même fragment asynchrone. Pour arriver à cela, nous avons besoin d'utiliser les [fragments nommés](https://webpack.js.org/guides/code-splitting-require/#chunkname) en donnant un nom au fragment en 3ème argument de `require.ensure`.
+Parfois on aimerait grouper tous les composants imbriqués sous la même route, dans un seul et même fragment asynchrone. Pour arriver à cela, nous avons besoin d'utiliser les [fragments nommés](https://webpack.js.org/guides/code-splitting-async/#chunk-names) en donnant un nom au fragment en utilisant une syntaxe de commentaire spéciale (requires webpack > 2.4) :
 
 ``` js
-const Foo = r => require.ensure([], () => r(require('./Foo.vue')), 'group-foo')
-const Bar = r => require.ensure([], () => r(require('./Bar.vue')), 'group-foo')
-const Baz = r => require.ensure([], () => r(require('./Baz.vue')), 'group-foo')
+const Foo = () => import(/* webpackChunkName: "group-foo" */ './Foo.vue')
+const Bar = () => import(/* webpackChunkName: "group-foo" */ './Bar.vue')
+const Baz = () => import(/* webpackChunkName: "group-foo" */ './Baz.vue')
 ```
 
-webpack groupera tous les modules asynchrones avec le même nom de fragment, dans le même fragment asynchrone. Cela signifie aussi que nous n'avons plus besoin de lister explicitement les dépendances pour `require.ensure` (équivaut à passer un tableau vide).
+webpack groupera tous les modules asynchrones avec le même nom de fragment dans le même fragment asynchrone.

docs/en/api/router-instance.md

@@ -56,6 +56,8 @@
   }
   ```
 
+  - `current` is the current Route by default (most of the time you don't need to change this)
+  - `append` allows you to append the path to the `current` route (as with [`router-link`](https://router.vuejs.org/en/api/router-link.html#props))
 
 - **router.addRoutes(routes)**
 

docs/en/essentials/history-mode.md

@@ -44,6 +44,34 @@ location / {
 
 For Node.js/Express, consider using [connect-history-api-fallback middleware](https://github.com/bripkens/connect-history-api-fallback).
 
+#### Internet Information Services (IIS)
+```
+<?xml version="1.0" encoding="UTF-8"?>
+<configuration>
+  <system.webServer>
+    <rewrite>
+      <rules>
+        <rule name="Handle History Mode and custom 404/500" stopProcessing="true">
+            <match url="(.*)" />
+            <conditions logicalGrouping="MatchAll">
+              <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
+              <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
+            </conditions>
+          <action type="Rewrite" url="index.html" />
+        </rule>
+      </rules>
+    </rewrite>
+      <httpErrors>     
+          <remove statusCode="404" subStatusCode="-1" />                
+          <remove statusCode="500" subStatusCode="-1" />
+          <error statusCode="404" path="/survey/notfound" responseMode="ExecuteURL" />                
+          <error statusCode="500" path="/survey/error" responseMode="ExecuteURL" />
+      </httpErrors>
+      <modules runAllManagedModulesForAllRequests="true"/>
+  </system.webServer>
+</configuration>
+```
+
 ## Caveat
 
 There is a caveat to this: Your server will no longer report 404 errors as all not-found paths now serve up your `index.html` file. To get around the issue, you should implement a catch-all route within your Vue app to show a 404 page:

examples/redirect/app.js

@@ -9,6 +9,8 @@ const Foo = { template: '<div>foo</div>' }
 const Bar = { template: '<div>bar</div>' }
 const Baz = { template: '<div>baz</div>' }
 const WithParams = { template: '<div>{{ $route.params.id }}</div>' }
+const Foobar = { template: '<div>foobar</div>' }
+const FooBar = { template: '<div>FooBar</div>' }
 
 const router = new VueRouter({
   mode: 'history',
@@ -50,6 +52,12 @@ const router = new VueRouter({
     // redirect with params
     { path: '/redirect-with-params/:id', redirect: '/with-params/:id' },
 
+    // redirect with caseSensitive
+    { path: '/foobar', component: Foobar, caseSensitive: true },
+
+    // redirect with pathToRegexpOptions
+    { path: '/FooBar', component: FooBar, pathToRegexpOptions: { sensitive: true }},
+
     // catch all redirect
     { path: '*', redirect: '/' }
   ]
@@ -97,6 +105,14 @@ new Vue({
           /redirect-with-params/123 (redirects to /with-params/123)
         </router-link></li>
 
+        <li><router-link to="/foobar">
+          /foobar
+        </router-link></li>
+
+        <li><router-link to="/FooBar">
+          /FooBar
+        </router-link></li>
+
         <li><router-link to="/not-found">
           /not-found (redirects to /)
         </router-link></li>

flow/declarations.js

@@ -4,9 +4,15 @@ declare class RouteRegExp extends RegExp {
   keys: Array<{ name: string, optional: boolean }>;
 }
 
+declare type PathToRegexpOptions = {
+  sensitive?: boolean,
+  strict?: boolean,
+  end?: boolean
+}
+
 declare module 'path-to-regexp' {
   declare var exports: {
-    (path: string, keys?: Array<?{ name: string }>): RouteRegExp;
+    (path: string, keys?: Array<?{ name: string }>, options?: PathToRegexpOptions): RouteRegExp;
     compile: (path: string) => (params: Object) => string;
   }
 }
@@ -48,6 +54,8 @@ declare type RouteConfig = {
   beforeEnter?: NavigationGuard;
   meta?: any;
   props?: boolean | Object | Function;
+  caseSensitive?: boolean;
+  pathToRegexpOptions?: PathToRegexpOptions;
 }
 
 declare type RouteRecord = {

src/components/link.js

@@ -105,7 +105,7 @@ export default {
 
 function guardEvent (e) {
   // don't redirect with control keys
-  if (e.metaKey || e.ctrlKey || e.shiftKey) return
+  if (e.metaKey || e.altKey || e.ctrlKey || e.shiftKey) return
   // don't redirect when preventDefault called
   if (e.defaultPrevented) return
   // don't redirect on right click

src/create-matcher.js

@@ -36,6 +36,7 @@ export function createMatcher (
       if (process.env.NODE_ENV !== 'production') {
         warn(record, `Route with name '${name}' does not exist`)
       }
+      if (!record) return _createRoute(null, location)
       const paramNames = record.regex.keys
         .filter(key => !key.optional)
         .map(key => key.name)

src/create-route-map.js

@@ -58,9 +58,15 @@ function addRouteRecord (
   }
 
   const normalizedPath = normalizePath(path, parent)
+  const pathToRegexpOptions: PathToRegexpOptions = route.pathToRegexpOptions || {}
+
+  if (typeof route.caseSensitive === 'boolean') {
+    pathToRegexpOptions.sensitive = route.caseSensitive
+  }
+
   const record: RouteRecord = {
     path: normalizedPath,
-    regex: compileRouteRegex(normalizedPath),
+    regex: compileRouteRegex(normalizedPath, pathToRegexpOptions),
     components: route.components || { default: route.component },
     instances: {},
     name,
@@ -77,11 +83,11 @@ function addRouteRecord (
   }
 
   if (route.children) {
-    // Warn if route is named and has a default child route.
+    // Warn if route is named, does not redirect and has a default child route.
     // If users navigate to this route by name, the default child will
     // not be rendered (GH Issue #629)
     if (process.env.NODE_ENV !== 'production') {
-      if (route.name && route.children.some(child => /^\/?$/.test(child.path))) {
+      if (route.name && !route.redirect && route.children.some(child => /^\/?$/.test(child.path))) {
         warn(
           false,
           `Named Route '${route.name}' has a default child route. ` +
@@ -101,21 +107,17 @@ function addRouteRecord (
   }
 
   if (route.alias !== undefined) {
-    if (Array.isArray(route.alias)) {
-      route.alias.forEach(alias => {
-        const aliasRoute = {
-          path: alias,
-          children: route.children
-        }
-        addRouteRecord(pathList, pathMap, nameMap, aliasRoute, parent, record.path)
-      })
-    } else {
+    const aliases = Array.isArray(route.alias)
+      ? route.alias
+      : [route.alias]
+
+    aliases.forEach(alias => {
       const aliasRoute = {
-        path: route.alias,
+        path: alias,
         children: route.children
       }
       addRouteRecord(pathList, pathMap, nameMap, aliasRoute, parent, record.path)
-    }
+    })
   }
 
   if (!pathMap[record.path]) {
@@ -136,8 +138,8 @@ function addRouteRecord (
   }
 }
 
-function compileRouteRegex (path: string): RouteRegExp {
-  const regex = Regexp(path)
+function compileRouteRegex (path: string, pathToRegexpOptions: PathToRegexpOptions): RouteRegExp {
+  const regex = Regexp(path, [], pathToRegexpOptions)
   if (process.env.NODE_ENV !== 'production') {
     const keys: any = {}
     regex.keys.forEach(key => {

src/history/hash.js

@@ -90,8 +90,8 @@ function pushHash (path) {
 }
 
 function replaceHash (path) {
-  const i = window.location.href.indexOf('#')
-  window.location.replace(
-    window.location.href.slice(0, i >= 0 ? i : 0) + '#' + path
-  )
+  const href = window.location.href
+  const i = href.indexOf('#')
+  const base = i >= 0 ? href.slice(0, i) : href
+  window.location.replace(`${base}#${path}`)
 }

src/history/html5.js

@@ -62,6 +62,16 @@ export class HTML5History extends History {
 
 export function getLocation (base: string): string {
   let path = window.location.pathname
+
+  // Special handling for cases where base contains hash ('#')
+  if (base && base.indexOf('#') > -1) {
+    path = window.location.href.replace(window.location.origin, '')
+    if (path.indexOf(base) === 0) {
+      // Leave the rest of the url as-is
+      return (path.slice(base.length) || '/')
+    }
+  }
+
   if (base && path.indexOf(base) === 0) {
     path = path.slice(base.length)
   }

src/util/route.js

@@ -79,7 +79,15 @@ function isObjectEqual (a = {}, b = {}): boolean {
   if (aKeys.length !== bKeys.length) {
     return false
   }
-  return aKeys.every(key => String(a[key]) === String(b[key]))
+  return aKeys.every(key => {
+    const aVal = a[key]
+    const bVal = b[key]
+    // check nested equality
+    if (typeof aVal === 'object' && typeof bVal === 'object') {
+      return isObjectEqual(aVal, bVal)
+    }
+    return String(aVal) === String(bVal)
+  })
 }
 
 export function isIncludedRoute (current: Route, target: Route): boolean {

test/e2e/specs/redirect.js

@@ -3,7 +3,7 @@ module.exports = {
     browser
     .url('http://localhost:8080/redirect/')
       .waitForElementVisible('#app', 1000)
-      .assert.count('li a', 10)
+      .assert.count('li a', 12)
       // assert correct href with base
       .assert.attributeContains('li:nth-child(1) a', 'href', '/redirect/relative-redirect')
       .assert.attributeContains('li:nth-child(2) a', 'href', '/redirect/relative-redirect?foo=bar')
@@ -14,7 +14,9 @@ module.exports = {
       .assert.attributeContains('li:nth-child(7) a', 'href', '/redirect/dynamic-redirect#baz')
       .assert.attributeContains('li:nth-child(8) a', 'href', '/redirect/named-redirect')
       .assert.attributeContains('li:nth-child(9) a', 'href', '/redirect/redirect-with-params/123')
-      .assert.attributeContains('li:nth-child(10) a', 'href', '/not-found')
+      .assert.attributeContains('li:nth-child(10) a', 'href', '/redirect/foobar')
+      .assert.attributeContains('li:nth-child(11) a', 'href', '/redirect/FooBar')
+      .assert.attributeContains('li:nth-child(12) a', 'href', '/not-found')
 
       .assert.containsText('.view', 'default')
 
@@ -55,6 +57,14 @@ module.exports = {
       .assert.containsText('.view', '123')
 
       .click('li:nth-child(10) a')
+      .assert.urlEquals('http://localhost:8080/redirect/foobar')
+      .assert.containsText('.view', 'foobar')
+
+      .click('li:nth-child(11) a')
+      .assert.urlEquals('http://localhost:8080/redirect/FooBar')
+      .assert.containsText('.view', 'FooBar')
+
+      .click('li:nth-child(12) a')
       .assert.urlEquals('http://localhost:8080/redirect/')
       .assert.containsText('.view', 'default')
 
@@ -104,6 +114,16 @@ module.exports = {
       .assert.urlEquals('http://localhost:8080/redirect/with-params/123')
       .assert.containsText('.view', '123')
 
+    .url('http://localhost:8080/redirect/foobar')
+      .waitForElementVisible('#app', 1000)
+      .assert.urlEquals('http://localhost:8080/redirect/foobar')
+      .assert.containsText('.view', 'foobar')
+
+    .url('http://localhost:8080/redirect/FooBar')
+      .waitForElementVisible('#app', 1000)
+      .assert.urlEquals('http://localhost:8080/redirect/FooBar')
+      .assert.containsText('.view', 'FooBar')
+
     .url('http://localhost:8080/redirect/not-found')
       .waitForElementVisible('#app', 1000)
       .assert.urlEquals('http://localhost:8080/redirect/')

test/e2e/specs/route-matching.js

@@ -124,7 +124,6 @@ module.exports = {
           })
         )
       }, null, '/optional-group/foo/bar')
-
       .end()
   }
 }