Css error during test

Getting this error when I run my test:

InvalidArgumentException: Nothing matched the filter [medication] CSS query provided for [http://ptr.dev/hospital/33/settings/messages].

Normally its because the element doesn't exist but I've double and triple checked and the elements are there. Here is the source for the div:

<div id='medication_div' class="col-sm-4">
                    <label for="medication">Medication</label>
                    <textarea class="form-control" maxlength="160" name="medication" cols="50" rows="10" id="medication">Your prescription has been filled, and is ready to be picked up at your earliest convenience. Please do not reply.</textarea>
                </div>

Originally the parent div had the same id of 'medication' so I changed that thinking that that may be why. Still was getting the same error after the change and I'm not sure why. Here is test method:

public function testMessageCanBeSaved()
    {
        $url = route('hospital-settings-messages', ['hospital' => $this->hospital]);

        $new_message = 'Testing out saving the text message';

        $message = TextMessage::where('name', 'medication')->first();

        $this->actingAs($this->user)
            ->visit($url)
            ->select('medication', 'messages')
            ->type($new_message, 'medication')
            ->press('Save')
            ->seeInDatabase('text_messages', ['id' => $message->id, 'message' => $message->message]);
    }

And here is source from blade template:

<div class="row">
        <div id="wrapper">
            @foreach($messages as $message)
                <div id='{{ strtolower($message->name) . '_div' }}' class="col-sm-4">
                    {!! Form::label($message->name, ucfirst($message->name)) !!}
                    {!! Form::textarea($message->name, $message->message ,['class' => 'form-control','maxlength' => '160']) !!}
                </div>
            @endforeach
        </div>

    </div>