Fakultas Ilmu Komputer UI

Commit b4c582a7 authored by Rahmania Astrid Mochtar's avatar Rahmania Astrid Mochtar
Browse files

add new section for exercise 4

parent 36f4e0b4
......@@ -54,4 +54,87 @@ Dan karena sekarang digunakan Django test runner untuk menjalankan functional te
```python
if __name__ == '__main__':
unittest.main(warnings='ignore')
```
## Exercise 4
### Functional Test-Friendly CSS
Dalam melakukan styling, hal yang perlu diperhatikan adalah konsistensi. Saat diberi functional test dibawah
```python
[...]
inputbox.send_keys('testing')
inputbox.send_keys(Keys.ENTER)
self.wait_for_row_in_list_table('1: testing')
inputbox = self.browser.find_element_by_id('id_new_item')
self.assertAlmostEqual(
inputbox.location['x'] + inputbox.size['width'] / 2,
512,
delta=10
)
```
Test ingin mengetahui apakah benar input kita di tengah web page. Bentuk `home.html` kita seperti dibawah tidak cukup karena tidak menghandle styling di page `/lists/{id}`.
```html
[...]
<form method="POST" action="/lists/new">
<p style="text-align: center;">
<input name="item_text" id="id_new_item" placeholder="Enter a to-do item" />
</p>
{% csrf_token %}
</form>
```
Sehingga kita dapat menggunakan Django Template Inheritance dan CSS Framework seperti Bootstrap.
Contohnya dengan kodingan dibawah adalah penggunaan Bootstrap dalam `base.html` hasil template inheritance.
```html
[...]
<div class="row">
<div class="col-md-6 col-md-offset-3">
<div class="text-center">
<h1>{% block header_text %}{% endblock %}</h1>
<form method="POST" action="{% block form_action %}{% endblock %}">
<input name="item_text" id="id_new_item"
placeholder="Enter a to-do item" />
​{% csrf_token %}
</form>
</div>
</div>
</div>
```
### Keterhubungan Perubahan Kode
Dalam exercise kali ini, kita telah menambahkan banyak file static yang diperlukan untuk styling aplikasi. Command `runserver` dapat mencari file-file static tersebut secara otomatis. Namun `LiveServerTestCase` tidak dapat menemukannya, oleh karena itu perlu diubah dengan `StaticLiveServerTestCase`.
Sebelumnya:
```python
from django.test import LiveServerTestCase
from selenium import webdriver
from selenium.common.exceptions import WebDriverException
from selenium.webdriver.common.keys import Keys
import time
MAX_WAIT = 10
class NewVisitorTest(LiveServerTestCase):
def setUp(self):
[...]
```
Menjadi:
```python
from django.contrib.staticfiles.testing import StaticLiveServerTestCase
from selenium import webdriver
from selenium.common.exceptions import WebDriverException
from selenium.webdriver.common.keys import Keys
import time
MAX_WAIT = 10
class NewVisitorTest(StaticLiveServerTestCase):
def setUp(self):
[...]
```
\ No newline at end of file
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