Skip to content

Commit 47a35bd

Browse files
doprydopry
committed
chore: add a device code demo to the tests/app/RP
1 parent aec2211 commit 47a35bd

File tree

5 files changed

+751
-39
lines changed

5 files changed

+751
-39
lines changed

‎tests/app/idp/idp/apps.py‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,20 @@
33

44

55
def cors_allow_origin(sender, request, **kwargs):
6+
origin = request.headers.get('Origin')
7+
68
return (
79
request.path == "/o/userinfo/"
810
or request.path == "/o/userinfo"
911
or request.path == "/o/.well-known/openid-configuration"
1012
or request.path == "/o/.well-known/openid-configuration/"
13+
# this is for testing the device authorization flow in the example rp.
14+
# You would not normally have a browser-based client do this and shoudn't
15+
# open the following endpoints to CORS requests in a production environment.
16+
or (origin == 'http://localhost:5173' and request.path == "/o/device-authorization")
17+
or (origin == 'http://localhost:5173' and request.path == "/o/device-authorization/")
18+
or (origin == 'http://localhost:5173' and request.path == "/o/token")
19+
or (origin == 'http://localhost:5173' and request.path == "/o/token/")
1120
)
1221

1322

‎tests/app/rp/src/app.html‎

Lines changed: 1 addition & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -40,42 +40,7 @@
4040
</style>
4141
%sveltekit.head%
4242
</head>
43-
4443
<body data-sveltekit-preload-data="hover">
45-
<div class="container">
46-
<h2>Django OAuth Toolkit Test RP</h2>
47-
<a
48-
href="https://github.com/django-oauth/django-oauth-toolkit"
49-
class="github-corner"
50-
aria-label="View source on GitHub"
51-
><svg
52-
width="80"
53-
height="80"
54-
viewBox="0 0 250 250"
55-
style="
56-
fill: #151513;
57-
color: #fff;
58-
position: absolute;
59-
top: 0;
60-
border: 0;
61-
right: 0;
62-
"
63-
aria-hidden="true"
64-
>
65-
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
66-
<path
67-
d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2"
68-
fill="currentColor"
69-
style="transform-origin: 130px 106px"
70-
class="octo-arm"
71-
></path>
72-
<path
73-
d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z"
74-
fill="currentColor"
75-
class="octo-body"
76-
></path></svg
77-
></a>
78-
<div>%sveltekit.body%</div>
79-
</div>
44+
<div>%sveltekit.body%</div>
8045
</body>
8146
</html>

‎tests/app/rp/src/routes/+layout.svelte‎

Lines changed: 105 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
<script>
2+
import { onMount } from 'svelte';
3+
import { page } from '$app/stores';
4+
5+
// Materialize tabs initialization
6+
onMount(() => {
7+
if (typeof M !== 'undefined') {
8+
const tabs = document.querySelectorAll('.tabs');
9+
M.Tabs.init(tabs);
10+
}
11+
});
12+
</script>
13+
14+
<a
15+
href="https://github.com/django-oauth/django-oauth-toolkit"
16+
class="github-corner"
17+
aria-label="View source on GitHub"
18+
><svg
19+
width="80"
20+
height="80"
21+
viewBox="0 0 250 250"
22+
style="
23+
fill: #151513;
24+
color: #fff;
25+
position: absolute;
26+
top: 0;
27+
border: 0;
28+
right: 0;
29+
"
30+
aria-hidden="true"
31+
>
32+
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
33+
<path
34+
d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2"
35+
fill="currentColor"
36+
style="transform-origin: 130px 106px"
37+
class="octo-arm"
38+
></path>
39+
<path
40+
d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z"
41+
fill="currentColor"
42+
class="octo-body"
43+
></path></svg
44+
></a
45+
>
46+
47+
<nav class="nav-extended" style="margin-bottom: 2em; background-color: #26a69a;">
48+
<div class="nav-wrapper">
49+
<a href="/" class="brand-logo">Django OAuth Toolkit Test RP</a>
50+
</div>
51+
<div class="nav-content">
52+
<ul class="tabs tabs-transparent">
53+
<li class="tab">
54+
<a href="/" class:active={$page.url.pathname === '/'}
55+
>OIDC Authorization Code Flow</a
56+
>
57+
</li>
58+
<li class="tab">
59+
<a href="/device" class:active={$page.url.pathname === '/device'}
60+
>Device Authorization Flow</a
61+
>
62+
</li>
63+
</ul>
64+
</div>
65+
</nav>
66+
67+
<div class="container">
68+
<slot />
69+
</div>
70+
71+
<style>
72+
.tabs .tab a {
73+
color: #fff;
74+
font-weight: 500;
75+
font-size: 1.1rem;
76+
transition:
77+
color 0.2s,
78+
border 0.2s;
79+
border-radius: 4px 4px 0 0;
80+
padding: 0.5rem 1.5rem;
81+
background: transparent;
82+
border-bottom: 2px solid transparent;
83+
}
84+
.tabs .tab a.active {
85+
background: #219080; /* Harmonize with #26a69a, slightly darker */
86+
color: #fff !important;
87+
font-weight: bold;
88+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
89+
border-bottom: 2px solid #219080;
90+
}
91+
.tabs .tab a:not(.active) {
92+
background: transparent;
93+
color: #e0f2f1;
94+
border-bottom: 2px solid #26a69a;
95+
}
96+
.tabs .tab a:hover {
97+
color: #1976d2;
98+
}
99+
.nav-extended {
100+
background-color: #26a69a;
101+
}
102+
.nav-wrapper .brand-logo {
103+
color: #fff !important;
104+
}
105+
</style>

0 commit comments

Comments
 (0)