maya-chen/flask
1
0
Fork 0
forked from orbit-oss/flask
Code Pull requests Activity

remove javascript fetch polyfill

Browse source
This commit is contained in:
David Lord 2022-02-14 10:33:25 -08:00
parent c7f2ab8e7a
commit 6f6e3289da
No known key found for this signature in database
GPG key ID: 7A1C87E3F5BC42A8
7 changed files with 22 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

16
examples/javascript/README.rst
View file

@ -3,15 +3,15 @@ JavaScript Ajax Example
Demonstrates how to post form data and process a JSON response using
JavaScript. This allows making requests without navigating away from the
page. Demonstrates using |XMLHttpRequest|_, |fetch|_, and
|jQuery.ajax|_. See the `Flask docs`_ about jQuery and Ajax.
.. |XMLHttpRequest| replace:: ``XMLHttpRequest``
.. _XMLHttpRequest: https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest
page. Demonstrates using |fetch|_, |XMLHttpRequest|_, and
|jQuery.ajax|_. See the `Flask docs`_ about JavaScript and Ajax.
.. |fetch| replace:: ``fetch``
.. _fetch: https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch
.. |XMLHttpRequest| replace:: ``XMLHttpRequest``
.. _XMLHttpRequest: https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest
.. |jQuery.ajax| replace:: ``jQuery.ajax``
.. _jQuery.ajax: https://api.jquery.com/jQuery.ajax/
@ -21,7 +21,7 @@ page. Demonstrates using |XMLHttpRequest|_, |fetch|_, and
Install
-------
::
.. code-block:: text
$ python3 -m venv venv
$ . venv/bin/activate
@ -31,7 +31,7 @@ Install
Run
---
::
.. code-block:: text
$ export FLASK_APP=js_example
$ flask run
@ -42,7 +42,7 @@ Open http://127.0.0.1:5000 in a browser.
Test
----
::
.. code-block:: text
$ pip install -e '.[test]'
$ coverage run -m pytest

8
examples/javascript/js_example/templates/base.html
View file

@ -1,7 +1,7 @@
<!doctype html>
<title>JavaScript Example</title>
<link rel="stylesheet" href="https://unpkg.com/sakura.css@1.0.0/css/normalize.css">
<link rel="stylesheet" href="https://unpkg.com/sakura.css@1.0.0/css/sakura-earthly.css">
<link rel="stylesheet" href="https://unpkg.com/normalize.css@8.0.1/normalize.css">
<link rel="stylesheet" href="https://unpkg.com/sakura.css@1.3.1/css/sakura.css">
<style>
ul { margin: 0; padding: 0; display: flex; list-style-type: none; }
li > * { padding: 1em; }
@ -13,10 +13,10 @@
</style>
<ul>
<li><span>Type:</span>
<li class="{% if js == 'plain' %}active{% endif %}">
<a href="{{ url_for('index', js='plain') }}">Plain</a>
<li class="{% if js == 'fetch' %}active{% endif %}">
<a href="{{ url_for('index', js='fetch') }}">Fetch</a>
<li class="{% if js == 'xhr' %}active{% endif %}">
<a href="{{ url_for('index', js='xhr') }}">XHR</a>
<li class="{% if js == 'jquery' %}active{% endif %}">
<a href="{{ url_for('index', js='jquery') }}">jQuery</a>
</ul>

7
examples/javascript/js_example/templates/fetch.html
View file

@ -2,14 +2,11 @@
{% block intro %}
<a href="https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch"><code>fetch</code></a>
is the <em>new</em> plain JavaScript way to make requests. It's
supported in all modern browsers except IE, which requires a
<a href="https://github.com/github/fetch">polyfill</a>.
is the <em>modern</em> plain JavaScript way to make requests. It's
supported in all modern browsers.
{% endblock %}
{% block script %}
<script src="https://unpkg.com/promise-polyfill@7.1.2/dist/polyfill.min.js"></script>
<script src="https://unpkg.com/whatwg-fetch@2.0.4/fetch.js"></script>
<script>
function addSubmit(ev) {
ev.preventDefault();

5
examples/javascript/js_example/templates/plain.html → examples/javascript/js_example/templates/xhr.html
View file

@ -2,8 +2,9 @@
{% block intro %}
<a href="https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest"><code>XMLHttpRequest</code></a>
is the plain JavaScript way to make requests. It's natively supported
by all browsers.
is the original JavaScript way to make requests. It's natively supported
by all browsers, but has been superseded by
<a href="{{ url_for("index", js="fetch") }}"><code>fetch</code></a>.
{% endblock %}
{% block script %}

4
examples/javascript/js_example/views.py
View file

@ -5,8 +5,8 @@ from flask import request
from js_example import app
@app.route("/", defaults={"js": "plain"})
@app.route("/<any(plain, jquery, fetch):js>")
@app.route("/", defaults={"js": "fetch"})
@app.route("/<any(xhr, jquery, fetch):js>")
def index(js):
return render_template(f"{js}.html", js=js)

2
examples/javascript/setup.cfg
View file

@ -1,6 +1,6 @@
[metadata]
name = js_example
version = 1.0.0
version = 1.1.0
url = https://flask.palletsprojects.com/patterns/jquery/
license = BSD-3-Clause
maintainer = Pallets

4
examples/javascript/tests/test_js_example.py
View file

@ -5,8 +5,8 @@ from flask import template_rendered
@pytest.mark.parametrize(
("path", "template_name"),
(
("/", "plain.html"),
("/plain", "plain.html"),
("/", "xhr.html"),
("/plain", "xhr.html"),
("/fetch", "fetch.html"),
("/jquery", "jquery.html"),
),