Fakultas Ilmu Komputer UI

Commit 31b702a8 authored by Izzan Fakhril Islam's avatar Izzan Fakhril Islam
Browse files

update README.md

parent 48bd03fd
Pipeline #22922 failed with stages
in 34 minutes and 55 seconds
......@@ -190,4 +190,202 @@ Berdasarkan buku **Test-Driven Development with Python 2nd Edition,** tutorial i
Selain itu, saya juga menambahkan implementasi *unit tests* dengan menggunakan `LiveServerTestCase` yaitu sebuah *library* bawaan dari Django, sehingga saya tidak perlu menjalankan perintah `runserver` lagi.
- Pengimplementasian *functional test* yang sudah disesuaikan dengan *unit test* yang diimplementasikan berdasarkan bab 7, sehingga ketika dijalankan *automated script* untuk *unit test* maupun *functional test*, berhasil.
\ No newline at end of file
- Pengimplementasian *functional test* yang sudah disesuaikan dengan *unit test* yang diimplementasikan berdasarkan bab 7, sehingga ketika dijalankan *automated script* untuk *unit test* maupun *functional test*, berhasil.
Selanjutnya, untuk pengimplementasian tutorial 4 ini, saya menambahkan **aesthetics test**, yaitu *functional testing* pada CSS dengan menggunakan modul `StaticLiveServerTestCase` yang merupakan bawaan dari Django. Berikut adalah salah satu contoh implementasinya.
```python
def test_layout_and_styling_todo_input_textbox(self):
selenium = self.selenium
selenium.get(self.host)
selenium.set_window_size(1024, 768)
todo_date = selenium.find_element_by_id('todo_date')
self.assertAlmostEqual(
todo_date.location['x'] + todo_date.size['width'] / 2,
740,
delta=10
)
def test_layout_and_styling_todo_commentary_input_textbox(self):
selenium = self.selenium
selenium.get(self.host)
selenium.set_window_size(1024, 768)
todo_commentary = selenium.find_element_by_id('comment_date')
self.assertAlmostEqual(
todo_commentary.location['x'] + todo_commentary.size['width'] / 2,
780,
delta=10
)
```
Untuk *templating languange* pada HTML, saya sudah mengimplementasikan sebelumya, dimulai dari *app* `tutorial-1` dan `tutorial-2`
````html
{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="description" content="Tutorial 2 PMPL">
<meta name="author" content="{{ author }}">
<!-- bootstrap csss -->
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
<title>
{% block title %} Tutorial 2 PMPL by {{ author }} - {{ npm }}{% endblock %}
</title>
</head>
<style>
@import url(https://fonts.googleapis.com/css?family=Roboto|Roboto+Slab);
.container, .footer-down, .header-up{
font-family: "Roboto", "sans-serif";
font-weight: normal;
}
</style>
<body style="background-color: darkseagreen">
<header class="header-up">
{% include "tutorial_2/../partials/header.html" %}
</header>
<content>
<div class="container">
{% block content %}
{% endblock %}
</div>
</content>
<footer class="footer-down">
<!-- TODO Block Footer dan include footer.html -->
{% block footer %}
{% include "tutorial_2/../partials/footer.html" %}
{% endblock %}
</footer>
<!-- Jquery n Bootstrap Script -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="application/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</body>
</html>
````
Dan berikut adalah konten dari `tutorial_2.html` saya.
```html
{% extends "tutorial_2/../layout/base.html" %}
{% block content %}
<style>
.form-control {
@import url(https://fonts.googleapis.com/css?family=Droid+Sans+Mono);
margin-top: 3px;
margin-bottom: 3px;
font-family: "Droid Sans Mono";
}
table {
text-align: left;
padding: 8px;
width: 100%;
}
</style>
<h1 align="center" style="font-weight: bold">{{ author }}'s Todo List</h1>
<br><br>
<div class="row">
<div class="col-md-6 col-xs-6">
<h4>Todo List Table</h4>
<br>
<table id="todo_table">
<tr>
<th><h5><b>Date/Time</b></h5></th>
<th><h5><b>Todo</b></h5></th>
</tr>
{% for todos in todos_dict %}
<tr>
<td>{{ todos.date }}</td>
<td>{{ todos.todo_list }}</td>
</tr>
{% endfor %}
</table>
<br>
<h4>Daily Todo List Comments</h4>
<br>
<table id="todo_comment_table">
<tr>
<th><h5><b>Date</b></h5></th>
<th><h5><b>Comment</b></h5></th>
</tr>
{% for commentary in todos_commentary_dict %}
<tr>
<td>{{ commentary.date }}</td>
<td>{{ commentary.comment }}</td>
</tr>
{% endfor %}
</table>
<br>
</div>
<div class="col-md-6 col-xs-6">
<h4><b>Add Todo</b></h4>
<form method="POST" action="{% url 'tutorial-2:add_todo' %}">
{% csrf_token %}
<table>
<tr>
<td>
Date/Time
</td>
<td>
<input type="datetime-local" name="date" id="todo_date" required="required" size="27"/>
</td>
</tr>
<tr>
<td>
Todo
</td>
<td>
<input type="text" name="activity" id="activity" required="required" size="27">
</td>
</tr>
</table>
<br>
<button type="submit" id="todo_submit" class="button btn-success">Submit</button>
</form>
<br>
<div class="errornote">
<p style="color: black; font-family: 'Roboto Slab'">{{ error_msg }}</p>
</div>
<h4><b>Add Daily Todo List Comment</b></h4>
<form method="POST" action="{% url 'tutorial-2:add_todo_commentary' %}">
{% csrf_token %}
<table>
<tr>
<td>
Date
</td>
<td>
<input type="date" name="date" id="comment_date" required="required" size="27"/>
</td>
</tr>
<tr>
<td>
Todo List Comment
</td>
<td>
<input type="text" name="comment" id="comment" required="required" size="27">
</td>
</tr>
</table>
<br>
<button type="submit" id="comment_submit" class="button btn-success">Submit</button>
</form>
<br>
<div class="errornote">
<p style="color: black; font-family: 'Roboto Slab'">{{ commentary_error_msg }}</p>
</div>
</div>
</div>
{% endblock %}
```
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment