GitHub
/
Vue.js
7
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

fix root v-else not rendering in prod and switched examples to minified vue for better prod coverage (#3943) 

* fix root v-else not rendering in production and switched examples to minified vue for better prod coverage

* add dev build comment to examples

* convert tabs to spaces in todomvc example for consistency
dev
Chris Fritz 8 years ago
committed by Evan You
parent
95bf0c000e
commit
4f5a47d750
14 changed files with 99 additions and 79 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 3
      examples/commits/index.html
  2. 3
      examples/elastic-header/index.html
  3. 3
      examples/firebase/index.html
  4. 6
      examples/grid/index.html
  5. 3
      examples/markdown/index.html
  6. 3
      examples/modal/index.html
  7. 3
      examples/move-animations/index.html
  8. 3
      examples/select2/index.html
  9. 3
      examples/svg/index.html
  10. 129
      examples/todomvc/index.html
  11. 3
      examples/tree/index.html
  12. 2
      package.json
  13. 8
      src/compiler/parser/index.js
  14. 6
      test/e2e/specs/grid.js

3
examples/commits/index.html
View File

@ -18,7 +18,8 @@
font-weight: bold;
}
</style>
<script src="../../dist/vue.js"></script>
<!-- Delete ".min" for console warnings in development -->
<script src="../../dist/vue.min.js"></script>
</head>
<body>
<div id="demo">

3
examples/elastic-header/index.html
View File

@ -4,7 +4,8 @@
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<title></title>
<script src="../../dist/vue.js"></script>
<!-- Delete ".min" for console warnings in development -->
<script src="../../dist/vue.min.js"></script>
<script src="http://dynamicsjs.com/lib/dynamics.js"></script>
<link rel="stylesheet" href="style.css">
<!-- template for the component -->

3
examples/firebase/index.html
View File

@ -5,7 +5,8 @@
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="style.css">
<!-- Vue -->
<script src="../../dist/vue.js"></script>
<!-- Delete ".min" for console warnings in development -->
<script src="../../dist/vue.min.js"></script>
<!-- Firebase -->
<script src="https://www.gstatic.com/firebasejs/3.4.0/firebase.js"></script>
<!-- VueFire -->

6
examples/grid/index.html
View File

@ -4,13 +4,14 @@
<meta charset="utf-8">
<title>Vue.js grid component example</title>
<link rel="stylesheet" href="style.css">
<script src="../../dist/vue.js"></script>
<!-- Delete ".min" for console warnings in development -->
<script src="../../dist/vue.min.js"></script>
</head>
<body>
<!-- component template -->
<script type="text/x-template" id="grid-template">
<table>
<table v-if="filteredData.length">
<thead>
<tr>
<th v-for="key in columns"
@ -30,6 +31,7 @@
</tr>
</tbody>
</table>
<p v-else>No matches found.</p>
</script>
<!-- demo root element -->

3
examples/markdown/index.html
View File

@ -6,7 +6,8 @@
<link rel="stylesheet" href="style.css">
<script src="https://unpkg.com/marked@0.3.6"></script>
<script src="https://unpkg.com/lodash@4.16.0"></script>
<script src="../../dist/vue.js"></script>
<!-- Delete ".min" for console warnings in development -->
<script src="../../dist/vue.min.js"></script>
</head>
<body>

3
examples/modal/index.html
View File

@ -3,7 +3,8 @@
<head>
<meta charset="utf-8">
<title>Vue.js Modal Example</title>
<script src="../../dist/vue.js"></script>
<!-- Delete ".min" for console warnings in development -->
<script src="../../dist/vue.min.js"></script>
<link rel="stylesheet" href="style.css">
</head>
<body>

3
examples/move-animations/index.html
View File

@ -29,7 +29,8 @@
}
</style>
<script src="https://cdn.jsdelivr.net/lodash/4.3.0/lodash.min.js"></script>
<script src="../../dist/vue.js"></script>
<!-- Delete ".min" for console warnings in development -->
<script src="../../dist/vue.min.js"></script>
</head>
<body>
<div id="el">

3
examples/select2/index.html
View File

@ -3,7 +3,8 @@
<head>
<meta charset="utf-8">
<title>Vue.js custom directive integration example (select2)</title>
<script src="../../dist/vue.js"></script>
<!-- Delete ".min" for console warnings in development -->
<script src="../../dist/vue.min.js"></script>
<script src="https://unpkg.com/jquery"></script>
<script src="https://unpkg.com/select2@4.0.3"></script>
<link href="https://unpkg.com/select2@4.0.3/dist/css/select2.min.css" rel="stylesheet">

3
examples/svg/index.html
View File

@ -4,7 +4,8 @@
<meta charset="utf-8">
<title>Vue.js SVG example</title>
<link rel="stylesheet" href="style.css">
<script src="../../dist/vue.js"></script>
<!-- Delete ".min" for console warnings in development -->
<script src="../../dist/vue.min.js"></script>
</head>
<body>

129
examples/todomvc/index.html
View File

@ -1,68 +1,69 @@
<!doctype html>
<html data-framework="vue">
<head>
<meta charset="utf-8">
<title>Vue.js • TodoMVC</title>
<link rel="stylesheet" href="https://unpkg.com/todomvc-app-css/index.css">
<script src="https:unpkg.com/director/build/director.js"></script>
<style>[v-cloak] { display: none; }</style>
</head>
<body>
<section class="todoapp">
<header class="header">
<h1>todos</h1>
<input class="new-todo"
autofocus autocomplete="off"
placeholder="What needs to be done?"
v-model="newTodo"
@keyup.enter="addTodo">
</header>
<section class="main" v-show="todos.length" v-cloak>
<input class="toggle-all" type="checkbox" v-model="allDone">
<ul class="todo-list">
<li v-for="todo in filteredTodos"
class="todo"
:key="todo.id"
:class="{ completed: todo.completed, editing: todo == editedTodo }">
<div class="view">
<input class="toggle" type="checkbox" v-model="todo.completed">
<label @dblclick="editTodo(todo)">{{ todo.title }}</label>
<button class="destroy" @click="removeTodo(todo)"></button>
</div>
<input class="edit" type="text"
v-model="todo.title"
v-todo-focus="todo == editedTodo"
@blur="doneEdit(todo)"
@keyup.enter="doneEdit(todo)"
@keyup.esc="cancelEdit(todo)">
</li>
</ul>
</section>
<footer class="footer" v-show="todos.length" v-cloak>
<span class="todo-count">
<strong>{{ remaining }}</strong> {{ remaining | pluralize }} left
</span>
<ul class="filters">
<li><a href="#/all" :class="{ selected: visibility == 'all' }">All</a></li>
<li><a href="#/active" :class="{ selected: visibility == 'active' }">Active</a></li>
<li><a href="#/completed" :class="{ selected: visibility == 'completed' }">Completed</a></li>
</ul>
<button class="clear-completed" @click="removeCompleted" v-show="todos.length > remaining">
Clear completed
</button>
</footer>
</section>
<footer class="info">
<p>Double-click to edit a todo</p>
<p>Written by <a href="http://evanyou.me">Evan You</a></p>
<p>Part of <a href="http://todomvc.com">TodoMVC</a></p>
</footer>
<head>
<meta charset="utf-8">
<title>Vue.js • TodoMVC</title>
<link rel="stylesheet" href="https://unpkg.com/todomvc-app-css/index.css">
<script src="https:unpkg.com/director/build/director.js"></script>
<style>[v-cloak] { display: none; }</style>
</head>
<body>
<section class="todoapp">
<header class="header">
<h1>todos</h1>
<input class="new-todo"
autofocus autocomplete="off"
placeholder="What needs to be done?"
v-model="newTodo"
@keyup.enter="addTodo">
</header>
<section class="main" v-show="todos.length" v-cloak>
<input class="toggle-all" type="checkbox" v-model="allDone">
<ul class="todo-list">
<li v-for="todo in filteredTodos"
class="todo"
:key="todo.id"
:class="{ completed: todo.completed, editing: todo == editedTodo }">
<div class="view">
<input class="toggle" type="checkbox" v-model="todo.completed">
<label @dblclick="editTodo(todo)">{{ todo.title }}</label>
<button class="destroy" @click="removeTodo(todo)"></button>
</div>
<input class="edit" type="text"
v-model="todo.title"
v-todo-focus="todo == editedTodo"
@blur="doneEdit(todo)"
@keyup.enter="doneEdit(todo)"
@keyup.esc="cancelEdit(todo)">
</li>
</ul>
</section>
<footer class="footer" v-show="todos.length" v-cloak>
<span class="todo-count">
<strong>{{ remaining }}</strong> {{ remaining | pluralize }} left
</span>
<ul class="filters">
<li><a href="#/all" :class="{ selected: visibility == 'all' }">All</a></li>
<li><a href="#/active" :class="{ selected: visibility == 'active' }">Active</a></li>
<li><a href="#/completed" :class="{ selected: visibility == 'completed' }">Completed</a></li>
</ul>
<button class="clear-completed" @click="removeCompleted" v-show="todos.length > remaining">
Clear completed
</button>
</footer>
</section>
<footer class="info">
<p>Double-click to edit a todo</p>
<p>Written by <a href="http://evanyou.me">Evan You</a></p>
<p>Part of <a href="http://todomvc.com">TodoMVC</a></p>
</footer>
<script>
// for testing
if (navigator.userAgent.indexOf('PhantomJS') > -1) localStorage.clear()
</script>
<script src="../../dist/vue.js"></script>
<script src="app.js"></script>
</body>
<script>
// for testing
if (navigator.userAgent.indexOf('PhantomJS') > -1) localStorage.clear()
</script>
<!-- Delete ".min" for console warnings in development -->
<script src="../../dist/vue.min.js"></script>
<script src="app.js"></script>
</body>
</html>

3
examples/tree/index.html
View File

@ -20,7 +20,8 @@
list-style-type: dot;
}
</style>
<script src="../../dist/vue.js"></script>
<!-- Delete ".min" for console warnings in development -->
<script src="../../dist/vue.min.js"></script>
</head>
<body>

2
package.json
View File

@ -26,7 +26,7 @@
"test": "npm run lint && flow check && npm run test:types && npm run test:cover && npm run test:e2e -- --env phantomjs && npm run test:ssr",
"test:unit": "karma start build/karma.unit.config.js",
"test:cover": "karma start build/karma.cover.config.js",
"test:e2e": "npm run build -- vue.js && node test/e2e/runner.js",
"test:e2e": "npm run build -- vue.min.js && node test/e2e/runner.js",
"test:ssr": "npm run build:ssr && VUE_ENV=server jasmine JASMINE_CONFIG_PATH=test/ssr/jasmine.json",
"test:sauce": "npm run sauce -- 0 && npm run sauce -- 1 && npm run sauce -- 2",
"test:types": "tsc -p ./types/test/tsconfig.json",

8
src/compiler/parser/index.js
View File

@ -130,14 +130,16 @@ export function parse (
}
function checkRootConstraints (el) {
if (process.env.NODE_ENV !== 'production') {
if (process.env.NODE_ENV !== 'production' && !warned) {
if (el.tag === 'slot' || el.tag === 'template') {
warned = true
warn(
`Cannot use <${el.tag}> as component root element because it may ` +
'contain multiple nodes:\n' + template
)
}
if (el.attrsMap.hasOwnProperty('v-for')) {
warned = true
warn(
'Cannot use v-for on stateful component root element because ' +
'it renders multiple elements:\n' + template
@ -150,12 +152,12 @@ export function parse (
if (!root) {
root = element
checkRootConstraints(root)
} else if (process.env.NODE_ENV !== 'production' && !stack.length && !warned) {
} else if (!stack.length) {
// allow 2 root elements with v-if and v-else
if (root.if && element.else) {
checkRootConstraints(element)
root.elseBlock = element
} else {
} else if (process.env.NODE_ENV !== 'production' && !warned) {
warned = true
warn(
`Component template should contain exactly one root element:\n\n${template}`

6
test/e2e/specs/grid.js
View File

@ -82,6 +82,12 @@ module.exports = {
{ name: 'Chuck Norris', power: Infinity }
])
browser
.clearValue('input[name="query"]')
.assert.count('p', 0)
.setValue('input[name="query"]', 'stringthatdoesnotexistanywhere')
.assert.count('p', 1)
browser.end()
function assertTable (data) {

Write Preview
Loading…
Cancel
Save